一、前言
sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby。(注:mac下自带Ruby无需在安装Ruby!)。
详细安装请参照官网:安装Sass | Sass中文网
我下载的是 Ruby 提供的7z压缩包,不是exe文件,解压后添加path环境变量即可。
二、在 webstorm 上使用 sass
在 WebStorm 设置中找到工具,然后找到File Watcher选项,如下图所示:
点击右上角的加号,选择 SCSS 或者 Sass,两者都行,只是编写样式文件时,后缀要改为相应的名称。选择后SCSS的界面如下图所示:
我选的 SCSS,这里需要修改的有程序(P)、参数(A)。
- 程序(P):程序输入框修改为下载的
Ruby的sass.bat,位于bin目录下,使用exe安装的配置应该类似。 - 参数(A):加上一个配置即可:
--style expanded,这是官网提供的解析后的 css 样式的格式。
点击确定后即刻生效。