使用Webstrom自动编译SASS/SCSS为CSS
sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby。(注:mac下自带Ruby无需在安装Ruby!)
window下安装SASS首先需要安装Ruby,先从官网下载Ruby并安装。安装过程中请注意勾选Add Ruby executables to your PATH添加到系统环境变量。
安装完成后需测试安装有没有成功,运行CMD输入以下命令:
ruby -v
//如安装成功会打印
ruby 2.2.2p95 (2015-04-13 revision 50295) [i386-mingw32]
如上已经安装成功。但因为国内网络的问题导致gem源间歇性中断因此我们需要更换gem源。
//1.删除原gem源
gem sources --remove https://rubygems.org/
//2.添加国内gem源
gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/
//3.打印是否替换成功
gem sources -l
//4.更换成功后打印如下
*** CURRENT SOURCES ***
https://gems.ruby-china.com/
Ruby自带一个叫做RubyGems的系统,用来安装基于Ruby的软件。我们可以使用这个系统来 轻松地安装Sass和Compass。要安装最新版本的Sass和Compass,你需要输入下面的命令:
//安装如下(如mac安装遇到权限问题需加 sudo gem install sass)
gem install sass
gem install compass
安装完成之后,你应该通过运行下面的命令来确认应用已经正确地安装到了电脑中:
sass -v
Sass 3.x.x (Selective Steve)
compass -v
Compass 1.x.x (Polaris)
Copyright (c) 2008-2015 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass
webstrom配置SCSS
setting ==> tools ==> file Watchers ==> + ==>scss
program设置为:
D:\rubyinstaller\bin\scss.bat (路径看Ruby安装路径)
Arguments设置为:
--no-cache --update --sourcemap -t compressed watch $FileName$:$FileParentDir$\css\$FileNameWithoutExtension$.css
本文来自博客园,作者:战立标,转载请注明原文链接:https://www.cnblogs.com/zhanlibiao/p/17382403.html