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

最新推荐文章于 2023-05-06 09:33:00 发布

山清水秀iOS

最新推荐文章于 2023-05-06 09:33:00 发布

阅读量747

点赞数

CC 4.0 BY-SA版权

文章标签： webpack javascript ViewUI

原文链接：http://www.cnblogs.com/amunamuna/p/9286097.html

本文总结了在构建Vue CLI多页面应用时可能会遇到的一些问题及解决方案，包括Webpack构造函数错误、未定义引用、配置对象验证错误、模块解析失败以及Webpack Loader名称规范等常见问题，提供了解决这些问题的具体步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

转载于:https://www.cnblogs.com/amunamuna/p/9286097.html