vue使用sass
一.安装sass依赖包
$ npm install sass-loader --save-dev
//sass-loader依赖于node-sass
$ npm install node-sass --save-dev
二.修改 style标签添加lang属性
<style lang="scss" type="text/css">
//你的sass语言
$primary-color: #333;
h1 {
color: $primary-color; //编译后就成了 color:#333;类似于js的变量!
}
</style>
三.npm编译
$ npm run dev
四.如果失败
则打开build文件夹下面的webpack.base.config.js添加
{
test: /\.scss$/,
loaders: ["style", "css", "sass"]
}
vue使用sass的更多相关文章
- 解决 vue 的缩进问题 及 vue 的 sass 调用 mixin 函数
1.解决 vue 的缩进问题 配置 eslint , 只要要eslint 对应的值为 0,则 eslint 将不会对其进行检测 (.eslintrc.js -- rules ) A. 不检测 缩进 ...
- vue 安装sass扩展
1.创建一个基于 webpack 模板的新项目 $ vue init webpack myvue 1 2.在当前目录下,安装依赖 $ cd myvue $ npm install 1 2 3.安装sa ...
- vue -- 使用sass并引入公共sass文件
sass可以提高我们的开发效率,怎么在vue的项目中使用sass并且可以设置一些公共的文件呢? 使用sass 1.安装sass的依赖包 npm install --save-dev sass-load ...
- 在vue配置sass
先npm两个插件 npm install sass-loader --save-dev npm install node-sass --save-dev 然后在webpack当中配置 { test: ...
- vue中sass的配置安装流程
1.安装node-sass,因为scss是基于此库的 cnpm install --save-dev node-sass 2.安装sass-loader cnpm install --save-dev ...
- vue - 添加sass(less)处理
1. 添加less.sass处理 1.1如果是sass,首先在当前目录安装处理插件(sass): npm i -D node-sass sass-loader 1.2如果是less,首先在当前目录安装 ...
- vue使用sass报Modele build failed: TypeError: this.getResolve is not a function at Object.loader...
项目中使用sass报错,之前一直使用同样的安装方式 cnpm install sass-loader node-sass -D,正常使用没问题,没想到这次同样的方式却报错了,网上查的原因是sass-l ...
- vue 使用 sass 或者 less ( vue-cli 3 )
项目使用 vue-cli 3 在项目中使用 sass npm install sass-loader --save -D cnpm install sass-loader --save -D ...
- vue 及sass安装
推荐:https://www.cnblogs.com/Mr--Li/p/7921150.html
随机推荐
- Xcode - 升级后模拟器无法响应电脑键盘
链接 Q: I used to be able to type with my real mac keyboard after launching the iPhone Simulator. Typi ...
- 7.1 安装软件包的三种方法 7.2 rpm包介绍 7.3 rpm工具用法 7.4 yum工具用法 7.5 yum搭建本地仓库
7.1 安装软件包的三种方法 7.2 rpm包介绍 7.3 rpm工具用法 7.4 yum工具用法 7.5 yum搭建本地仓库 三种方法 rpm工具----->类型windows下的exe程序 ...
- UNIX环境编程学习笔记(1):——出错处理errno
lienhua342014 年 8 月 24 日 1. errno变量 文件 <errno.h> 中定义了符号 errno 以及可以赋予它的各种常量,这些常量都是以字符 E 开头.例如,若 ...
- JSON.stringify报cyclic object value错误
这是一个典型的循环引用的错误,一个对象里引用自己就会立刻得到这个错误: obj = { x:555, y: "hi" }; obj.myself = obj; try{ json ...
- less语法(二)混合属性
摘要: 前面介绍了less的变量和extend语法,今天在研究下混合属性(Mixin).混合可以说是less的另一个特征,你可以将通用属性定义在一块,然后使用时直接调用此混合属性. 混合: 在 LES ...
- aspose导出excel文件
using Aspose.Cells; using System; using System.Collections.Generic; using System.Data; using System. ...
- Xcode工程添加第三方文件的详细分析 Create folder references for any added folders(转)
在开发iOS项目的时候需要导入第三方的库文件,但是通过Xcode导入第三方源文件的时候会提示一些信息,不知所以然. 现在看到的文档都是针对Xcode3的,针对Xcode4的说明很少,现在分享出来. 官 ...
- Dubbo -- 系统学习 笔记 -- 示例 -- 多协议
Dubbo -- 系统学习 笔记 -- 目录 示例 想完整的运行起来,请参见:快速启动,这里只列出各种场景的配置方式 多协议 可以自行扩展协议,参见:协议扩展 (1) 不同服务不同协议 比如:不同服务 ...
- python与VScode
用VScode写python是非常方便的.vscode是一个功能非常强大的编辑器,下面介绍大致的使用方法: 下载安装python,配置环境变量. 下载安装VScode(vscode会自动连接pytho ...
- Windows最全快捷键
单独按Windows:显示或隐藏“开始”功能表 Windows+BREAK:显示“系统属性” 对话框 Windows+D:显示桌面 Windows+M:最小化所有窗口 Windows+Shift+M: ...