dartsass开发环境搭建

1.下载软件

官网地址：https://sass-lang.com/dart-sass

github下载地址：https://github.com/sass/dart-sass/releases/tag/1.32.8

2.配置环境变量

在path环境变量中添加C:\Users\gmbjzg\software\dart-sass

3.环境测试

打开cmd, 输入以下命令

sass --version


4.dart-sass与sublime的结合

1.工具>编译系统>编译新系统

{
"cmd": ["sass", "--update", "$file:${file_path}/../css/${file_base_name}.css", "--stop-on-error"],
"selector": "source.sass, source.scss",
"line_regex": "Line ([0-9]+):",
"windows":
{
"shell": "true"
}
}


sass命令：

sass -h
1)--update
编译
2)编译后css目录
$file:${file_path}/../css/${file_base_name}.css
3)编译时遇到error错误则终止脚本
--stop-on-error
4)扩展版
--style expanded
5)压缩版
--style compressed
6)生成map文件
--source-map


2.环境测试

新建index.scss源文件

/*变量的定义*/
$bgc:#ff5;
body {
background-color: $bgc;
}


ctrl + b编译代码