npm run dev/build错误

1. image.png

2.安装的过程中出错

image.png
3.npm i -D webpack@latest 修复上面问题
4.npm run dev
image.png

5.yarn add webpack-contrib/html-webpack-plugin -D
报错

image.png
6..yarn addhtml-webpack-plugin -D
image.png
7.npm install vue-loader@latest
image.png
8.npm i vue-loader@14.2.2
image.png
9.node_modules\vue-loader\lib\template-compiler\index.js 下进行修改：
if (!isProduction) {

code = prettier.format(code, { semi: false, parser: 'babel' })
}

image.png
image.png
10.yarn add prettier@1.12.1 --save-dev
11.最后发现是本地的package.json和电脑上的版本不一致,修改为低版本后成功；
rm -rf node_modules
npm install
npm cache clean --force
delete package-lock.json file
npm install
npm remove webpack-dev-server
npm install webpack-dev-server@2.9.1

npm run build报错

image.png

TypeError: Cannot read property 'compilation' of undefined 错误。

（这里需要强调一下，安装环境的使用一定要-save-dev或者是-save，否则欲哭无泪啊）

很明显，这是node一些包的版本对应不上的问题。。。

1、首先定位到uglifyjs-webpack-plugin中的index.js文件中，将项目中的该包升级或者降级到1.0.0版本

npm i uglifyjs-webpack-plugin@1.0.0 --save

2、然后定位到optimize-css-assets-webpack-plugin\node_modules\last-call-webpack-plugin\src\index.js文件报错

将项目中的该包（optimize-css-assets-webpack-plugin）升级或者降级到2.0.0版本

npm i optimize-css-assets-webpack-plugin@2 --save

3、这个时候报缺少cssnano包，直接安装上即可