前言
本来我之前就写过一片关于vue-cli中引入sass的简书,但是最近入然发现不能用了,如果在本篇的方法下引入的sass不管用的话,不妨试一试之前的方法
点我跳转之前的sass教程
新的vue-cli中引入sass支持开始 go!
1、安装node-sass、sass-loder、style-loader、sass-resources-loader
ps: 这四个一个都不能少哦!
cnpm install node-sass --save-dev
cnpm install sass-loader --save-dev
cnpm install style-loader --save-dev
cnpm install sass-resources-loader --save-dev
2、 修改build中的utils.js
首先,在src/assets/css 目录下创建一个sass文件
scss: generateLoaders('sass')
修改成:
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '../src/assets/css/app.scss')//注意这里改成自己的路径
}
}
)
最后一步,别丢了
在组件的style标签中添加 lang='scss'