当前位置： 移动技术网 > IT编程>脚本编程>vue.js > 在vue项目中使用sass的配置方法

在vue项目中使用sass的配置方法

2018年03月27日  | 移动技术网IT编程  | 我要评论

替宠新妃,非主流动态手机壁纸,都市美娇

  1、创建一个基于 webpack 模板的新项目

$ vue init webpack myvue

2、在当前目录下，安装依赖

$ cd myvue
$ npm install

3、安装sass的依赖包

npm install --save-dev sass-loader
//sass-loader依赖于node-sass
npm install --save-dev node-sass

4、在build文件夹下的webpack.base.conf.js的rules里面添加配置

{
 test: /\.sass$/,
 loaders: ['style', 'css', 'scss']
}

如下图所示：

5、在app.vue中修改style标签

<style lang="scss">

6、然后运行项目

$ npm run dev

7、修改app.vue的样式，可以看下效果

8、运行结果背景变成灰色吗，说明你已成功配置好sass

总结

以上所述是小编给大家介绍的在vue项目中使用sass的配置方法，希望对大家有所帮助

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网