多语言展示
当前在线:1170今日阅读:103今日分享:49

Win系统怎么安装Sass

Sass是Ruby语言写的,但是两者的语法没有关系。不懂Ruby,照样可以正常使用Sass。只是必须先安装Ruby,然后再安装Sass。 如果你使用的是IOS系统,那么你的系统已经安装好了Ruby。如果你使用的是微软的Windows系统,那么安装就有些麻烦。不过也不用担心,按照下面的步骤就能帮你快速的安装好。
工具/原料

Win系统

安装Sass
1

到RubyInstaller官网上下载Ruby安装文件(随意选择一个版本),此处选择的是最新版本官网下载网址:https://rubyinstaller.org/downloads/

2

Ruby安装文件下载好后,可以按应用软件安装步骤进行安装Ruby。

3

在安装过程中,个人建议将其安装在C盘下,在安装过程中勾选第1个选项,如图所示。

4

等待安装。

5

安装完成。

6

Ruby安装完成后,在开始菜单中找到新安装的Ruby,并启动Ruby的Command控制面板,如图所示。

7

在启动的Ruby命令控制面板中输入下面的命令:gem install sass 输入上面命令,回车后就会自动安装Sass。

8

如图安装成功,这样也就可以使用Sass了。

使用Sass转译成CSS文件
1

首先创建Sass文件,Sass文件是普通的文本文件,不过其文件后缀名有两种,一种为“.sass”;另一种为“.scss”。我们一般用“.scss”就好,至于这两种文件扩展名的区别在于“.sass”是Sass语言文件的扩展后缀名,而“.scss”是SCSS语言文件的扩展后缀名,至于Sass和SCSS的详细区别这里不做介绍。你可以简单的理解为他们都是CSS预处理器语言,而且两者功能特性都一样,只是书写规则不同而已。 要转译Sass文件的前提是有文件可转,因此先在项目中创建一个Sass文件,此例中将其命名为“style.scss”,并且将其放在对应的项目样式中,如D盘的“www/workspace/Sass/css”目录下。

2

然后打开该文件,声明变量并调用变量。

3

启动Ruby的Command控制面板,找到需要转译的Sass文件,如此例此文件放置在D盘的“www/workspace/Sass/css”目录下。输入sass style.scss style.css回车后,转译成功,在目录下多出了几个文件。

4

打开我们要用的CSS文件,style.css,发现变量已经转译成功。

5

用运行的cmd代码打开的命令行窗口,也可以进行转译Sass文件。

推荐信息