webpack-5.x版本 启动server服务时的报错和解决办法

1.报错:

The 'mode' option has not been set, webpack will fallback to 'production' for this value.

原因:启动时,没有指定是开发模式还是线上模式

解决办法:

在启动时添加:--mode development   例如:"dev": "webpack server --mode development"

2.报错:

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.

WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.

这3个问题都是一个原因:资源(asset)和入口起点超过指定文件限制，需要在 vue.config.js 文件内做如下配置

解决办法:

在webpack.config.js文件中添加

  //警告 webpack 的性能提示
  performance: {
    hints:'warning',
    //入口起点的最大体积
    maxEntrypointSize: 50000000,
    //生成文件的最大体积
    maxAssetSize: 30000000,
    //只给出 js 文件的性能提示
    assetFilter: function(assetFilename) {
      return assetFilename.endsWith('.js');
    }
  },