webpack5配置vue.config.js文件时出现的一些报错

1. 报错Component name xxx should always be multi-word

解决方法：
在vue.config.js中设置lintOnSave:false

2. webpack < 5 used to include polyfills for node.js core modules by default.
   This is no longer the case. Verify if you need this module and configure a polyfill for it.
   If you want to include a polyfill, you need to:
   - add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
   - install 'path-browserify'
   If you don't want to include a polyfill, you can use an empty module like this:
   resolve.fallback: { "path": false }

解决方法：

npm install path-browserify

vue.config.js中配置

configureWebpack: {
    resolve: {
      fallback: { path: require.resolve("path-browserify") },
    },
  }

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

解决方法：

//v5的devServer去掉了get和after，添加了setupMiddlewares（功能一样）
 
module.exports = {
  // ...
  devServer: {
    //after: mockServer(), //v4
    setupMiddlewares: (middlewares, devServer) => {
      if (!devServer) {
        throw new Error('webpack-dev-server is not defined');
      }
       mockServer(devServer.app)
 
      return middlewares;
    },
  },
};

4. options has an unknown property 'overlay'.

解决方法：

module.exports={
  devServer:{
    //...
    hot: true,
    port: devPort,
    open: true,
    client: {
      overlay: {
        warnings: true,
        errors: true,
      },
    },
  }
}