错误提示
TypeError: Cannot read property '0' of undefinedat Function.isWebpack4 (/Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/terser-webpack-plugin/dist/index.js:106:28)at TerserPlugin.apply (/Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/terser-webpack-plugin/dist/index.js:527:36)at WebpackOptionsApply.process (/Users/mi/IdeaProjects/GCI-manage/dcp-ui/src/gci-dcp-vue/node_modules/@vue/cli-service/node_modules/webpack/lib/WebpackOptionsApply.js:481:16)at webpack (/Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/@vue/cli-service/node_modules/webpack/lib/webpack.js:57:48)at /Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/@vue/cli-service/lib/commands/build/index.js:192:5at new Promise (<anonymous>)at build (/Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/@vue/cli-service/lib/commands/build/index.js:191:10)at async /Users/mi/IdeaProjects/manage/test-ui/src/test-vue/node_modules/@vue/cli-service/lib/commands/build/index.js:88:7
错误原因
terser-webpack-plugin 的代码中,尝试访问 undefined 的属性时失败了,具体原因可能是 webpack 版本不匹配,或者 terser-webpack-plugin 的版本不支持当前的 webpack。
检查项目中 webpack 和 terser-webpack-plugin 的版本是否匹配
npm list webpack terser-webpack-plugin
develop ±✚ npm list webpack terser-webpack-plugin
vue-antd-jeecg@1.0.4 /Users/mi/IdeaProjects/manage/ui/src/test-vue├─┬ @vue/cli-plugin-babel@3.12.1│ └─┬ webpack@4.47.0│ └── terser-webpack-plugin@1.4.6├─┬ @vue/cli-plugin-eslint@3.12.1│ └─┬ webpack@4.47.0│ └── terser-webpack-plugin@1.4.6├─┬ @vue/cli-service@3.12.1│ ├── terser-webpack-plugin@1.4.6│ └─┬ UNMET PEER DEPENDENCY webpack@4.47.0│ └── terser-webpack-plugin@1.4.6 deduped├── terser-webpack-plugin@4.2.3└─┬ vue-photo-preview@1.1.3└── webpack@3.12.0npm ERR! peer dep missing: webpack@^4.0.0, required by @intervolga/optimize-cssnano-plugin@1.0.6npm ERR! peer dep missing: webpack@^4.0.0 || ^5.0.0, required by @soda/friendly-errors-webpack-plugin@1.8.1npm ERR! peer dep missing: webpack@>=4.0.0, required by @vue/preload-webpack-plugin@1.1.2npm ERR! peer dep missing: webpack@^4.0.0, required by cache-loader@2.0.1
执行命令返回的结果表明: 当前的问题是项目中 webpack 和 terser-webpack-plugin 的版本不匹配,并且有多个 webpack 版本被引入。这种情况容易导致构建工具链出错
解决方案
- 强制统一 webpack 版本
# 强制所有依赖统一到 webpack@4.x:
npm install webpack@4.47.0 --save-devnpm dedupe
- 删除旧的依赖和缓存,重新
rm -rf node_modules package-lock.jsonnpm cache clean --forcenpm install