【Sass学习笔记】002

【Sass学习笔记】002

二、Sass 环境安装

1 Sass安装（windows版）

1.1 安装 Ruby

第一步：下载 Ruby 安装包

**中文：**/

**中文文档地址：**/

**linux 版本下载地址：**/

**windows 版本下载地址：**/

选择 WITH DEVKIT 下面的版本进行下载，慕课教程建议安装在 C 盘，勾选 ”Add … PATH“

第二步：安装 Ruby

慕课教程建议安装在 C 盘，勾选 ”Add … PATH“，下一步我只勾选了必须勾选的第一个选项！

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5n5nTGGC-165296889182)(image-20210625110744756.png)]

1.2 安装 Sass

第三步（选）：通过命令安装 Sass

在开始菜单到 Start Command Prompt with Ruby ，并打开（cmd窗口）

打开电脑的命令终端，输入下面的命令：

代码语言：javascript代码运行次数：0运行复制

gem install sass

提醒一下，在使用 Mac 的同学，可能需要在上面的命令前加上"sudo"，才能正常安装：

代码语言：javascript代码运行次数：0运行复制

sudo gem install sass

如果上面的方法没有安装成功，可以使用下面的两种方法。

第四步（选）：通过 Compass 来安装 Sass

除了使用 gem 命令来安装 Sass 之外，还可以通过安装 compass 来安装 Sass，因为 Compass 是基于 Sass 开发的一个框架。也就是说，你安装了 Compass，也就同时安装好了 Sass。

同样的在你的命令终端输入下面的命令：

代码语言：javascript代码运行次数：0运行复制

sudo gem install sass

执行完上面的命令之后，就开始安装 Compass 和 Sass。

注：Compass 是一个成熟的、基于 Sass 开发的一个框架，这里面集成了很多写好的 mixins 和 Sass 函数。不过在此暂不做过多阐述。

第五步（选）：本地安装 Sass

由于有时候直接使用上面的命令安装会让你无法正常实现安装（网络受限原因），当碰到这种情况之时，那么安装需要特殊去处理，可以通过下面的方法来实现 Sass 的正常安装：

可以到 Rubygems(/) 网站上将 Sass 的安装包（）下载下来，然后在命令终端输入：

代码语言：javascript代码运行次数：0运行复制

gem install <把下载的安装包拖到这里>

直接回车即可安装成功。

注：在 iOSX 系统平台，可以直接将下载的安装包拖到 “gem install” 后面，如果在是 Windows 系统，需要手功输入安装的文件路径。

第六步（选）：淘宝 RubyGems 镜像安装 Sass

除了下载 Sass 安装包到本地安装之外，碰到网络原因无法安装时还可以使用淘宝 RubyGems 镜像安装 Sass。只是我们需要通过 gem sources 命令来配置源，先移除默认的 源，然后添加淘宝的源 ：

第一步：移动默认的源

代码语言：javascript代码运行次数：0运行复制

gem sources --remove /

第二步：指定淘宝的源

代码语言：javascript代码运行次数：0运行复制

gem sources -a /

第三步：查看指定的源是不是淘宝源

代码语言：javascript代码运行次数：0运行复制

gem sources -l

返回结果如下：

代码语言：javascript代码运行次数：0运行复制

*** CURRET SOURCES ***

请确保只有 。如果无误之后，执行下面的命令：

代码语言：javascript代码运行次数：0运行复制

gem install sass

2 查测 Sass 及更新

2.1 查测 Sass

通过上面的几种方法都可以安装 Sass，但是，我们要如何确认自己是否安装 Sass 成功了呢？其实很简单，只需要通过下面的命令即可：

代码语言：javascript代码运行次数：0运行复制

sass -v

如果在你的命令终端能看到类似这样的信息就表示你的电脑安装 Sass 已成功。也就是说可以正常的使用 Sass 了。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AWge9b5-165296889185)(image-2021062511199974-1624602182218.png)]

2.2 更新 Sass

维护 Sass 的团队会不断的为 Sass 添加新的功能，那么如何确保自己已安装的 Sass 也具有这些新的功能特性呢？不会是卸载了重新安装吧（虽然安装也就是一个命令的事情）？ 其实不需要这么麻烦，只需要在命令终端执行：

代码语言：javascript代码运行次数：0运行复制

gem update sass

这个时候你看到类似下面这样的信息，表示你的 Sass 已更新到最新版本。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XVb7AR5T-165296889185)(image-2021062511209545-162460217978.png)]

卸载/删除 Sass

在常期使用的时候难免会碰到无法解决的问题，有时候可能需要卸载 Sass，然后再重新安装 Sass。那么怎么卸载 Sass 呢？

其实他也就是一句命令的事情：

代码语言：javascript代码运行次数：0运行复制

gem uninstall sass

这样就卸载了 Sass ，但这行命令基本上是使用不上。

本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。 原始发表：2025-01-06，如有侵权请联系 cloudcommunity@tencent 删除前往查看学习笔记终端sass教程框架