vue.config.js 的devServer.overlay无法设置，显示Invalid options object

[Flying-Cake]

Version

5.0.8

Environment info

System:
    OS: Windows 10 10.0.19043
    CPU: (12) x64 AMD Ryzen 5 4600H with Radeon Graphics
  Binaries:
    Node: 16.14.0 - D:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 8.3.1 - D:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: Not Found
    Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.47)
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1
    @vue/babel-helper-vue-transform-on:  1.0.2
    @vue/babel-plugin-jsx:  1.1.1
    @vue/babel-plugin-transform-vue-jsx:  1.2.1
    @vue/babel-preset-app:  5.0.8
    @vue/babel-preset-jsx:  1.3.1
    @vue/babel-sugar-composition-api-inject-h:  1.3.0
    @vue/babel-sugar-composition-api-render-instance:  1.3.0
    @vue/babel-sugar-functional-vue:  1.2.2
    @vue/babel-sugar-inject-h:  1.2.2
    @vue/babel-sugar-v-model:  1.3.0
    @vue/babel-sugar-v-on:  1.3.0
    @vue/cli-overlay:  5.0.8
    @vue/cli-plugin-babel: ~5.0.0 => 5.0.8
    @vue/cli-plugin-eslint: ~5.0.0 => 5.0.8
    @vue/cli-plugin-router:  5.0.8
    @vue/cli-plugin-vuex:  5.0.8
    @vue/cli-service: ~5.0.0 => 5.0.8
    @vue/cli-shared-utils:  5.0.8
    @vue/compiler-core:  3.2.37
    @vue/compiler-dom:  3.2.37
    @vue/compiler-sfc:  3.2.37
    @vue/compiler-ssr:  3.2.37
    @vue/component-compiler-utils:  3.3.0
    @vue/reactivity:  3.2.37
    @vue/reactivity-transform:  3.2.37
    @vue/runtime-core:  3.2.37
    @vue/runtime-dom:  3.2.37
    @vue/server-renderer:  3.2.37
    @vue/shared:  3.2.37
    @vue/web-component-wrapper:  1.3.0
    eslint-plugin-vue: ^8.0.3 => 8.7.1
    vue: ^3.2.13 => 3.2.37
    vue-eslint-parser:  8.3.0
    vue-hot-reload-api:  2.3.4
    vue-loader:  17.0.0 (15.10.0)
    vue-style-loader:  4.1.3
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

在vue.config.js 中配置devServer.overlay，然后运行serve

What is expected?

支持devServer.overlay，或者更新文档

What is actually happening?

ValidationError: Invalid options object. Dev Server has been initialized using an options object that does n ot match the API schema.

[ntnyq]

webpack-dev-server has been updated from v3 to v4 since @vue/cli v5

overlay option were moved to the client option:

v3

module.exports = {
  devServer: {
    clientLogLevel: "info",
    overlay: true,
    progress: true,
  },
};

v4

module.exports = {
  devServer: {
    client: {
      logging: "info",
      // Can be used only for `errors`/`warnings`
      //
      // overlay: {
      //   errors: true,
      //   warnings: true,
      // }
      overlay: true,
      progress: true,
    },
  },
};

Refs:

• Vue CLI - Migrate from v4
• webpack-dev-server - Migration guide

[Flying-Cake]

感谢您的来信，我已经收到。----良良