Vue报错* !!vue-style-loader!css-loader?和you can run: npm install --save !!vue-style-loader!css-loader

Vue报错

ERROR  Failed to compile with 1 errors                                                                                                                                                                        11:17:27
This dependency was not found:
 
* !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-331f341c","scoped":true,"hasInlineConfig":false}!less-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Index.vue in ./src/components/Index.vue
 
To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-331f341c","scoped":true,"hasInlineConfig":false}!less-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Index.vue   

 

其中的问题是：Vue文件中，样式type问题

<style lang="less" scoped>

写成less报错，因为缺少两个插件，less和less-loader,将less换为postcss报错消失，为了可以设置为less，执行下面语句安装插件即可

cnpm install less less-loader --save-dev

解决方案

此类问题一般是缺少相关依赖而导致的，对于本例，仔细看一下报错提示信息，抓住关键词，vue-style-loader!css-loader，说明是css解析的时候出了问题。
所以，解决方案就要根据情况而定，看你使用的CSS语言是什么,是 常规的 或者 less 或者 sass。
 

如果是 常规 的，执行 npm install stylus-loader css-loader style-loader --save-dev 安装依赖就行。

如果是 less 的，执行 npm install less less-loader --save-dev 安装依赖就行。

如果是 sass 的，执行 npm install sass sass-loader --save-dev 安装依赖就行。或者（$npm intall sass-loader --save ; $npm install node-sass --save）

如果你不知道，好吧，你三个都执行吧。
一般只有在初始化配置的的时候才会出现这个问题，如果是已经完好的项目都会在package.json中已经配好，直接install即可。

转自mcya