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

Posted chenglideyueguang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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

 









以上是关于vue-cli多页面应用常遇到的问题的主要内容,如果未能解决你的问题,请参考以下文章

vue-cli配置多页面应用

vue-cli3构建多页面应用

使用vue-cli构建多页面应用+vux

vue-cli + webpack 多页面实例应用

基于vue-cli搭了一个多页面应用的空脚手架

vue-cli创建的项目,配置多页面的实现方法