web前端_Vue框架_关于Can't resolve 'sass-loader' in...错误的解决办法
因为在Vue2+element UI(不会推荐去Element UI官网看看)项目中需要用到<style lang="scss">,发现每次都会报错,在网上找了一些解决办法也比较乱,下面是我在遇到这个问题的一种解决办法:在Chrome浏览器中的错误:就是不能解析sass-loader 这种东西。所以第一步需要在项目中引入:npm install sa
·
因为在Vue2+element UI(不会推荐去Element UI官网看看)项目中需要用到<style lang="scss">
,发现每次都会报错,在网上找了一些解决办法也比较乱,下面是我在遇到这个问题的一种解决办法:
在Chrome浏览器中的错误:
就是不能解析sass-loader 这种东西。
所以第一步需要在项目中引入:
npm install sass-loader -D
npm install node-sass -D
第一个很快引入成功:
但是在第二个却出了错误:
但是我再用cnpm install node-sass -D
却成功了!!!(现在比较渣,也不知道是什么原因)
这样项目就能够成功运行了:
如果你还不行那可能就需要去webpack.base.conf.js中的module:的rules:[ ] 下最后添加试试(反正我是没有用):
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
scss: 'style-loader!css-loader!sass-loader',
sass: 'style-loader!css-loader!sass-loader?indentedSyntax',
},
},
},
下面是官方Sass Loader的引入方法Sass Loade官方仓库:
npm install sass-loader node-sass webpack --save-dev
npm install style-loader css-loader --save-dev
// webpack.config.js
module.exports = {
...
module: {
rules: [{
test: /\.scss$/,
use: [{
loader: "style-loader" // creates style nodes from JS strings
}, {
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "sass-loader" // compiles Sass to CSS
}]
}]
}
};
更多推荐
已为社区贡献3条内容
所有评论(0)