vue-cli多页面应用常遇到的问题

1、TypeError: webpack.optimize.OccurenceOrderPlugin is not a constructor

此问题出现在webpack 3中，解决办法很简单，将occurenceOrderPlugin改为OccurrenceOrderPlugin即可。

2、ReferenceError: rm is not defined

在build.js中，引入：

require('shelljs/global')

3、WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.

- configuration.resolve.extensions[0] should not be empty.
-> A non-empty string

resolve: {
  extensions: ['', '.js', '.jsx']
},
//删除：'',改为：
resolve: {
  extensions: ['.js', '.jsx']
},

 

4、

WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.resolve has an unknown property 'fallback'.

 

5、

ERROR in Entry module not found: Error: Can't resolve 'babel' in '/Users/xxx/ideaProjects/xxx'
BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.
You need to specify 'babel-loader' instead of 'babel',
see https://webpack.js.org/guides/migrating/#automatic-loader-module-name-extension-removed

 

loader不能用简写省去 -loader 的形式。因此vue-loader应该使用全拼的形式。 babel-loader也是

6、context.compiler.hooks.invalid.tap('WebpackDevMiddleware', invalid);

                         ^

TypeError: Cannot read property 'invalid' of undefined

1、卸载webpack-dev-middleware ，执行npm uninstall webpack-dev-middleware，使用dev-server自带的webpack-dev-middleware

2、重新install webpack-dev-server， 执行 npm install webpack-dev-server --save-dev