20190423-Vscode与Sass不得不说的秘密(>^ω^<)
这是乱七八糟的前言:emmm,今天倔强的点,是关于Vscode使用easySass插件时,不安装ruby环境,直接使用插件编译时,不进行设置,分音是会转译为Css文件的= =,神坑的后知后觉才发现是因为插件的问题,搞了近俩小时不止~
目录
1、easySass插件的默认用户设置
1.1文件》首选项》设置》settings.json全局配置文件
1.2默认用户设置
"easysass.compileAfterSave": true,
//保存scss/sass文件后自动编译
"easysass.excludeRegex": "",
//提供文件名正则表达式,匹配到的文件会被排除,不会编译为css,默认为空,则功能关闭
"easysass.formats": [
{
"format": "expanded",
"extension": ".css"
},
{
"format": "compressed",
"extension": ".min.css"
}
],
//编译不同风格的css
1.easysass.formats[i]format用以编译生成对应风格的css,参数值
nested:嵌套缩进的 css 代码。
expanded:没有缩进的、扩展的css代码。
compact:简洁格式的 css 代码。
compressed:压缩后的 css 代码。
2.easysass.formats[i]extension用以设置编译输出的文件拓展名
此处可以自定义文件名,输出的 css 文件名会按照“当前 Sass 文件名(不含拓展名)+此处自定义文件名”的格式来生成 例如:设置"easysass.formats[i].extension": ".min.css"
,假设当前的 Sass 文件名为 style.scss,则编译输出的 css 文件名为 style.min.css
"easysass.targetDir": ""
很多情况下 scss/sass 文件和 css 文件是不在同一个目录下的,而 Easy Sass 默认输出的 css 是和当前 Sass 文件处于相同目录的
为此我们需要通过该参数来配置输出路径
1.3更改用户设置
2、分音导入还是需要加下划线
emmm,用VScode的easySass是不需要装ruby环境的┓( ´∀` )┏真是喜大普奔,不过,emmm分音时还是要记得更改用户设置,以及导入时千万记得加上下划线_,不然会报找不到文件夹的错误!
参考文献:
随机推荐
- Mac PyCharm激活码(转载CSDN的猪哥66文章)
对于很多刚接触python的新手来说,各种资源都是非常稀缺的.我也是刚接触python不久的新手,有好的资源就分享出来大家共同进步. 这篇文章是教你怎么安装和破解pycharm的教程,我在2019.4 ...
- 【EXCEL-折线图】百折不挠 | 用EXCEL画出与众不同的折线图(曲线图)
很多熟悉EXLCE的朋友都知道EXCEL在生成统计图表方面的强大功能,我们在写各类总结.报告.方案等文档时常涉及到各类统计数字,将统计数字用图表的形式展示出来,既直观又美观.下面我分享一种不一样的折线 ...
- MySQL之父造访腾讯云 为腾讯云数据库开源点赞
近日,技术大牛 MariaDB 公司创始人兼CTO Michael Widenius(又名Monty).MariaDB 基金会主席 Kaj 来到中国,针对MariaDB与腾讯云的技术合作进行回访.去年 ...
- HTTP传输编码增加了传输量,只为解决这一个问题 | 实用 HTTP
题图:by @Olga Hi,大家好,我是承香墨影! HTTP 协议在网络知识中占据了重要的地位,HTTP 协议最基础的就是请求和响应的报文,而报文又是由报文头(Header)和实体组成.大多数 HT ...
- 最详细的Windows平台安装MongoDB教程
一.MongoDB简介 MongoDB是一个基于分布式文件存储的数据库,由C++语言编写,旨在为WEB应用提供可扩展的高性能数据存储解决方案. MongoDB将数据存储为一个文档,数据结构由键值(ke ...
- 使用ConcurrentHashMap一定线程安全?
前言 老王为何半夜惨叫?几行代码为何导致服务器爆炸?说好的线程安全为何还是出问题?让我们一起收看今天的<走进IT> 正文 CurrentHashMap出现背景 说到ConcurrentHa ...
- 程序猿必知必会Linux命令之awk
前言 对于一名专业的程序员来说,Linux相关知识是必须要掌握的,其中对于文本的处理更是我们常见的操作,比如格式化输出我们需要的数据,这些数据可能会来源于文本文件或管道符,或者统计文本里面我们需要的数 ...
- Hystrix源码解析
1. Hystrix源码解析 1.1. @HystrixCommand原理 直接通过Aspect切面来做的 1.2. feign hystrix原理 它的本质原理就是对HystrixCommand的动 ...
- Socket深度探索 4 PHP(转)
[连载] Socket 深度探索 4 PHP (一) [连载] Socket 深度探究 4 PHP (二) [连载] Socket 深度探究 4 PHP (三)
- windows远程桌面神器
近需要远程家庭版的WINDOWS系统的笔记本,发现它竟然没有远程桌面功能,系统属性下面根本没有远程桌面选项. 于是上网搜解决方案,找到下面这个神器,名字叫RDPwrap,不但能开通Vista以后任何版 ...