【Sass学习笔记】002-Sass 环境安装

落日映苍穹つ 2023-09-29 15:11 9阅读 0赞

### 文章目录 ###

*  二、Sass 环境安装
 *   *  1 Sass安装（windows版）
     *   *  1.1 安装 Ruby
         *   *  第一步：下载 Ruby 安装包
             *  第二步：安装 Ruby
         *  1.2 安装 Sass
         *   *  第三步（选）：通过命令安装 Sass
             *  第四步（选）：通过 Compass 来安装 Sass
             *  第五步（选）：本地安装 Sass
             *  第六步（选）：淘宝 RubyGems 镜像安装 Sass
     *  2 查测 Sass 及更新
     *   *  2.1 查测 Sass
         *  2.2 更新 Sass
     *  3 卸载/删除 Sass

# 二、Sass 环境安装 #

## 1 Sass安装（windows版） ##

### 1.1 安装 Ruby ###

#### 第一步：下载 Ruby 安装包 ####

\*\*中文官网：\*\*http://www.ruby-lang.org/zh\_cn/

\*\*中文文档地址：\*\*http://www.ruby-lang.org/zh\_cn/documentation/

\*\*linux 版本下载地址：\*\*http://www.ruby-lang.org/zh\_cn/downloads/

\*\*windows 版本下载地址：\*\*https://rubyinstaller.org/downloads/

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

#### 第二步：安装 Ruby ####

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

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

### 1.2 安装 Sass ###

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

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

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

gem install sass

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

sudo gem install sass

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

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

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

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

sudo gem install sass

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

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

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

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

可以到 [Rubygems][](http://rubygems.org/) 网站上将 [Sass 的安装包][Sass]（http://rubygems.org/gems/sass）下载下来，然后在命令终端输入：

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

直接回车即可安装成功。

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

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

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

第一步：移动默认的源

gem sources --remove https://rubygems.org/

第二步：指定淘宝的源

gem sources -a https://ruby.taobao.org/

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

gem sources -l

返回结果如下：

*** CURRENT SOURCES ***
    https://ruby.taobao.org

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

gem install sass

## 2 查测 Sass 及更新 ##

### 2.1 查测 Sass ###