Cannot disable webpack error overlay

[octref]

Version

3.0.0-rc.3

Reproduction link

https://github.com/octref/disable-overlay

Steps to reproduce

• Observe vue.config.js tried using both chainWebpack and configureWebpack to disable dev server overlay
• yarn serve
• Notice the syntax error in Helloworld.vue causes browser to show error overlay

Note: If I disable overlay by manually going into https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/commands/serve.js#L129-L131 in my node_modules, I can disable overlay. It seems vue.config.js is not read properly by vue-cli for the webpack options.

What is expected?

Error overlay is disabled

What is actually happening?

Error overlay is enabled

[LinusBorg]

devServer options are processed separatly by vue-cli serve, so they have their own options key in vue.config.js:

https://cli.vuejs.org/config/#devserver

// vue.config.js
module.exports = {
  devServer: {
    overlay: false,
  }
}

[octref]

Ah I see, I just searched for webpack and directly jumped to https://cli.vuejs.org/guide/webpack.html. Thanks for the explanation.

However I'm wondering why neither chainWebpack nor configureWebpack worked. Are they only for properties that can't be configured at the top level, such as devServer? If that's the case, I think a reference to which properties cannot be configured with chainWebpack or configureWebpack should be included on top of https://cli.vuejs.org/guide/webpack.html.

[navidshad]

They way of disabling overlay changed:

// vue.config.js
module.exports = {
  devServer: {
    client: {
      overlay: true,
    },
  },
};