下载完,安装程序。
运行cmd.exe命令
输入ruby -v,会显示安装的ruby 版本.
现在我们开始安装sass,在“开始”菜单中打开ruby的控制面板。
输入gem install sass ,按回车键执行命令。如果提示安装成功,这个步骤后面的内容可忽略。但大多数情况下,由于国内网络原因,导致 rubygems.org 存放在 Amazon S3 上面的资源文件间歇性连接失败。这时候我们可以通过gem sources命令来配置源,先移除默认的源,然后添加淘宝的源,然后查看下当前使用的源是哪个,如果是淘宝的,则表示可以输入sass安装命令gem install sass了。具体操作如下:
先移除默认的源,命令为gem sources --remove /,按回车,结果如下:
添加淘宝的源,命令为gem sources -a ,按回车,结果如下:
查看当前使用的源,命令为gem sources -1,按回车,结果如下:
执行gem install sass 命令,安装sass, 结果如下:
执行sass -v命令,就可以看到你安装的sass版本了,结果如下:
到这里,sass就已经安装好了。后话:
更新sass的命令语句为:gem update
如果想要安装sass的某一特定版本,命令语句为: gem install sass --version=3.3.0
如果想要删除sass的某一特定版本,命令语句为: gem uninstall sass --version=3.3.0
查看ruby 安装的所有程序包,命令语句为: gem list
ruby安装因为sass依赖于ruby环境,所以装sass之前先确认装了ruby。先导官网下载个ruby
在安装的时候,请勾选Add Ruby executables to your
PATH这个选项,添加环境变量,不然以后使用编译软件的时候会提示找不到ruby环境
sass安装
如果你喜欢偷懒,或者你公司网络限制比较多,请直接看最后一段
安装完ruby之后,在开始菜单中,找到刚才我们安装的ruby,打开Start Command Prompt with Ruby
然后直接在命令行中输入
gem install sass
按回车键确认,等待一段时间就会提示你sass安装成功。
如果要安装beta版本的,可以在命令行中输入
gem install sass --pre
你还可以从sass的Git repository来安装,git的命令行为
git clone git://github.com/nex3/sass.git cd sass rake install
如果上述的办法你尝试失败了,那说明要么被你的网络墙了这个,要么你的网络信号不好。你可以尝试本地安装,不过有点复杂。这里暴漏个惊天秘密,那就是koala这个编译工具已经内置了sass,所以如果你安装了koala,就根本不需要安装sass,注意ruby还是得安装。关于koala请参阅编译工具。
webStorm 配置sass ,安装ruby 及实现编译scss文件1、首先从 官网下载ruby
2、安装 过程中
安装成功后,查看版本信息
ruby -v
gem -v
3、 安装Sass ,安装完后,会在 C:\Ruby23\bin 多出如下文件
gem install sass
4、Webstorm里添加Watcher
工具栏--File ---打开Settings下的 -----Tools ---【File Watchers】右边栏的 "+" 选择 SCSS
Program:
C:\Ruby23\bin\scss.bat
Arguments
--no-cache --update --sourcemap --watch $FileName$:$FileNameWithoutExtension$.css
Output paths to refresh
$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map
Environment variables
C:/Ruby23/bin
ps、 注意,如果文件路径有修改如:
未修改: C:\Ruby23-x64\bin
修改后: C:\Ruby23\bin
这几个地方要统一:
之前是 Ruby23-x64 ------>改后: Ruby23
环境变量也需要改动。。。。。。。。。。。所以。。最好使用默认名称。
编译后前后CSS