hbuilder配置sass，scss自动构建

1 新建一个项目，随便创建要给scss的文件

1.png

2 去ruby官网找下载，这里是官网链接 ，根据系统选择最新版
ruby官网下载

image.png

3 安装ruby，全部勾上，这里是添加环境变量和utf8支持，一定要勾上

image.png

4 安装完成之后输入

ruby -v

确认一下

image.png

5 继续输入

gem install sass

来安装sass和scss支持，由于scss是sass的后续支持版本，所有直接写sass就可以了
安装完成

image.png

6 检查sass.bat scss.bat是否在ruby安装目录的bin文件夹下面

image.png

7 在hbuilder的工具->预编译设置里头

image.png

8 配置如下

image.png

其中，命令参数写

--no-cache %FileName% %FileBaseName%.css

保存
9 我们test.scss文件里头随便写写

image.png

然后保存，就会发现右边的树状目录会自动生成

image.png

点击test.css看一下

image.png
生成好了

scss和sass自动构建完成，再也不用右键编译了