options has an unknown property ‘overlay‘.

时间:2025-05-09 11:40:52

错误描述

报错: ERROR  ValidationError: Invalid options object. Dev Server has been initialized using an options object that does not match the API s
chema.
         - options has an unknown property 'overlay'. These properties are valid:
           object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, h
ttps?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?,
setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }

问题原因

vue2升级vue3,在使用vue-cli5,编写时,会遇到此问题。找不到overlay属性。实际上是属性的使用方法变了。
可以找到node_modules\webpack-dev-server\lib\)文件查看源码

        if (typeof  !== "undefined") {
          (
            "overlay",
            typeof  === "boolean"
              ? String()
              : ()
          );
        }

解决办法

将源代码:

  devServer: {
	......
    overlay: {
      warnings: false,
      errors: true
    }
  }

修改为:

  devServer: {
  ......
    client: {
      overlay: {
        warnings: false,
        errors: true
      }
    },
  }