vue项目报错集合

研究网页变灰色，拿vue移动端项目做测试，引发的一系列报错，记录下。传送门：网页变灰色css：https://blog.csdn.net/pang787559613/article/details/105335728。

最终报错解决，运行成功，把sourcetree中所有改动丢弃，依旧完美启动。

1、sh: webpack-dev-server: command not found

解决：cnpm install

ps： 现在我知道为什么运行项目前要运行这句了，安装依赖，不然就会跟我一样出现各种不是什么大问题的报错（然鹅我今天就漏掉了这个，一系列猛如虎的报错操作之后，发现根源在这）。

2、Cannot find module 'webpack-cli’

解决：npm install webpack-cli -g

3、Error: Cannot find module ‘webpack’

解决：npm install --save-dev webpack

4、Error: Cannot find module 'webpack/bin/config-yargs’

我的版本：

webpack-dev-server@2.11.5

webpack-cli@3.3.11

webpack@4.42.1

原因: 目前版本的webpack-dev-server@2.11.5 不支持 webpack@4.32.2

解决: 重装一个webpack-dev-server是3.0版本以上就兼容 :npm i webpack-dev-server@3.10.3 -d

5、TypeError: compilation.mainTemplate.applyPluginsWaterfall is not a function

原因： html-webpack-plugin版本不兼容问题

解决：

https://github.com/jantimon/html-webpack-plugin

npm i --save-dev html-webpack-plugin

yarn add --dev html-webpack-plugin

6、TypeError: Cannot read property ‘vue’ of undefined

原因： vue-loader这个插件被破坏了

解决： 重新安装依赖：npm install vue-loader@latest --save-dev

7、Error: Cannot find module ‘html-webpack-plugin’

解决： 重新安装：npm insatall html-webpack-plugin -d

8、vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config.

Module parse failed: Unexpected token (2:0)

解决： 重新安装vue-loader：npm install vue-loader

9、This dependency was not found:

解决： 重新安装sass、sass-loader：npm i sass sass-loader --save-dev

10、Module build failed: TypeError: this.getResolve is not a function at Object.loader

原因： sass-loader的版本过高导致的编译错误，当前最高版本是8.x，需要退回到7.3.1

解决：

npm uninstall sass-loader（卸载当前版本）

npm install sass-loader@7.3.1 --save-dev（安装指定版本）

运行成功：