Win系统
到RubyInstaller官网上下载Ruby安装文件(随意选择一个版本),此处选择的是最新版本官网下载网址:https://rubyinstaller.org/downloads/
Ruby安装文件下载好后,可以按应用软件安装步骤进行安装Ruby。
在安装过程中,个人建议将其安装在C盘下,在安装过程中勾选第1个选项,如图所示。
等待安装。
安装完成。
Ruby安装完成后,在开始菜单中找到新安装的Ruby,并启动Ruby的Command控制面板,如图所示。
在启动的Ruby命令控制面板中输入下面的命令:gem install sass 输入上面命令,回车后就会自动安装Sass。
如图安装成功,这样也就可以使用Sass了。
首先创建Sass文件,Sass文件是普通的文本文件,不过其文件后缀名有两种,一种为“.sass”;另一种为“.scss”。我们一般用“.scss”就好,至于这两种文件扩展名的区别在于“.sass”是Sass语言文件的扩展后缀名,而“.scss”是SCSS语言文件的扩展后缀名,至于Sass和SCSS的详细区别这里不做介绍。你可以简单的理解为他们都是CSS预处理器语言,而且两者功能特性都一样,只是书写规则不同而已。 要转译Sass文件的前提是有文件可转,因此先在项目中创建一个Sass文件,此例中将其命名为“style.scss”,并且将其放在对应的项目样式中,如D盘的“www/workspace/Sass/css”目录下。
然后打开该文件,声明变量并调用变量。
启动Ruby的Command控制面板,找到需要转译的Sass文件,如此例此文件放置在D盘的“www/workspace/Sass/css”目录下。输入sass style.scss style.css回车后,转译成功,在目录下多出了几个文件。
打开我们要用的CSS文件,style.css,发现变量已经转译成功。
用运行的cmd代码打开的命令行窗口,也可以进行转译Sass文件。