在vue中使用sass的配置的方法
来源:互联网 发布:js字符串相等 编辑:程序博客网 时间:2024/05/16 04:20
1、创建一个基于 webpack 模板的新项目
$ vue init webpack myvue
2、在当前目录下,安装依赖
$ cd myvue$ npm install
3、安装sass的依赖包
npm install --save-dev sass-loader//sass-loader依赖于node-sassnpm install --save-dev node-sass
4、在build文件夹下的webpack.base.conf.js的rules里面添加配置
{ test: /\.sass$/, loaders: ['style', 'css', 'sass']}
如下图所示:
5、在APP.vue中修改style标签
<style lang="scss">
6、然后运行项目
$ npm run dev
7、修改APP.vue的样式,可以看下效果
8、运行结果背景变成灰色吗,说明你已成功配置好sass
希望能够帮助更多人….(^__^) 嘻嘻……
阅读全文
4 0
- 在vue中使用sass的配置的方法
- 用vue构建项目笔记4(在vue中使用sass的配置)
- 如何在vue中使用sass
- 在vue+webpack中使用sass
- 如何在vue中使用sass
- 如何在vue中使用sass
- 在vue中使用jQuery的方法
- vue中使用sass
- vue-cli中配置sass
- 在 vue-cli 脚手架中引用 jQuery、bootstrap 以及使用 sass、less 编写 css [vue-cli配置入门]
- 在 vue-cli 脚手架中引用 jQuery、bootstrap 以及使用 sass、less 编写 css [vue-cli配置入门]
- vue项目中使用sass
- vue-cli中使用sass
- 在vue项目中使用Sass/Scss(视窗环境)
- windows下sass的安装使用,及在webstrom中配置
- Jekyll中Sass的使用
- sass中变量的使用
- vue安装node-sass出现问题的解法方法
- react-native笔记
- Boost Thread使用
- 关于Java的File.separator
- poj3311 动态规划 轮廓线 或者状态压缩
- [Leetcode] 301. Remove Invalid Parentheses 解题报告
- 在vue中使用sass的配置的方法
- 微软100题-009
- Linux快捷键总结
- Java中的static关键字解析
- Android--------在Fragment中通过MVP模式用Okhttp进行数据请求
- 有关java web工程降级jdk遇到的问题
- 归并排序和快速排序
- JavaScript-DOM(下篇)
- 解惑 spring 嵌套事务