Ubuntu 16.04 / 如何安装 Sass
要在 Ubuntu 16.04 上安装旧版 Ruby Sass,您可以使用 APT 中的 ruby-sass 软件包或 RubyGems 中的 sass gem。然而,Ruby Sass 是已停止维护的实现,因此应仅在重现现有项目时考虑使用,对于新的开发环境,请使用当前支持的操作系统和 Dart Sass。通过 gem 安装也不会安装最新的 Dart Sass。
在安装前请检查实现和操作系统支持
Sass 是一种将使用变量和嵌套规则编写的样式表转换为 CSS(层叠样式表)的工具。SCSS 是一种类似于 CSS 的 Sass 语法,使用大括号,文件扩展名为 .scss。即使命令名称相同 sass,Ruby Sass 和 Dart Sass 也是不同的实现。
根据官方 Sass 指南,Ruby Sass 已于 2019 年停止支持。Ubuntu 16.04 也已结束其标准支持和扩展安全维护(ESM),截至 2026 年 10 月,额外的安全支持需要检查 Ubuntu Pro 的 Legacy 附加服务的条件。操作系统支持范围可以在 Canonical 的 Ubuntu 16.04 指南 中找到。
| 目的 | 选择方法 | 需要检查的条件 |
|---|---|---|
| 重现现有的 Ubuntu 16.04 构建 | APT 的 ruby-sass | 检查仓库中的安装候选版本以及项目所需的版本。 |
| 现有项目需要特定的 Ruby Sass gem | 使用 RubyGems 安装指定的版本 | Ruby 和依赖的 gem 也需要兼容。 |
| 切换到新项目或维护中的构建 | 在受支持的操作系统上使用 Dart Sass | 这与使用旧版 Ubuntu 自带的默认 Node.js 的过程有所不同。 |
首先,备份您的源代码和现有的 CSS,并检查项目中的 Gemfile.lock、package.json 等所使用的实现和版本。以下两种旧安装方法是可选的,因此无需两者都安装。
使用 APT 安装旧版 Ruby Sass
要重现 Ubuntu 16.04 上使用的发行包,请按以下顺序在终端中进行检查。您需要一个可以运行 sudo 的账户,并能访问正常工作的 APT 仓库。
sudo apt update
apt-cache policy ruby-sass
sudo apt install ruby-sass
sass --version
Candidate 字段在 apt-cache policy 中显示选择安装的软件包版本。如果没有候选版本或更新失败,不要假设可以安装;首先检查仓库设置、网络和环境的支持状态。不要仅因为找不到软件包就随意添加仓库或禁用签名验证。
安装后,应显示 Sass 版本。发行版软件包版本可能与 gem 版本不同,Sass 3.4.23 (Selective Steve) 来自之前帖子的示例输出。当前安装结果不一定必须与该字符串匹配。
使用 RubyGems 安装所需的旧版本
这是在现有项目需要 Ruby Sass gem 时进行检查的一种方法。下面是一个指定 3.7.4 的示例,如果项目需要不同版本,请优先考虑该要求。RubyGems Sass 3.7.4 信息 指出需要 Ruby 2.0.0 或更高版本,但仅凭此条件并不意味着所有依赖的 gem 都可以在旧版 Ruby 上安装。
sudo apt update
sudo apt install ruby
ruby --version
gem --version
gem install --user-install sass -v 3.7.4 --no-document
--user-install 是将其安装在用户 gem 目录而非系统范围内的一种选项。如果出现警告提示找不到可执行文件,请按照 RubyGems 用户安装指南 的说明操作,并将该目录的 bin 添加到您的 PATH。在 Bash 中,您可以将以下命令应用于当前终端,然后进行验证。
export PATH="$(ruby -r rubygems -e 'print Gem.user_dir')/bin:$PATH"
sass --version
如果这是您将继续使用的设置,请将上面的 export 行添加到 ~/.bashrc 中一次,并在新的终端中检查。要恢复,请删除添加的行并重新打开终端。如果安装失败,请检查错误中显示的依赖 gem 和 Ruby 版本,并根据项目中存储的锁文件和当时的环境重现该环境。不要禁用 HTTPS 验证来解决证书或 TLS 错误。
通过将 SCSS 转换为 CSS 来验证安装
仅打印版本不能确认实际的转换。在一个单独的空工作文件夹中,创建一个 style.scss 文件并保存以下全部内容。在有现有文件的文件夹中,首先确保与现有示例文件名没有冲突。
$brand: #336699;
.notice {
color: $brand;
strong {
font-weight: 700;
}
}
在该文件夹中运行以下命令将生成 style.css。
sass style.scss style.css
生成的 CSS 应该包含以下选择器和数值。根据实现和输出格式设置,空格、换行或源映射注释可能会有所不同。
.notice {
color: #336699;
}
.notice strong {
font-weight: 700;
}
更改颜色值并再次转换,以查看 CSS 中的值是否发生变化,从而确认输入文件和输出文件之间的关系。恢复到原始值并再次运行将恢复示例状态。Sass 转换是创建 CSS 文件的过程,要将其应用到网页中,需要在相应的 HTML 中加载输出的 CSS。
当命令发生冲突或需要回滚安装时
如果安装后出现 sass: command not found,请检查安装是否成功并查看 PATH。如果出现的版本与预期不同,检查首先选择的是哪个可执行文件——是通过 APT、用户 gem 还是其他工具安装的。
command -v sass
type -a sass
sass --version
将用户 gem 的 bin 放到 PATH 前面可能会优先使用该命令。在通过 APT 和 gem 重复安装的环境中,不要仅看版本号;还要记录路径。不要随意删除文件,而应使用安装时使用的管理工具进行删除。
- 要回退 APT 安装,请使用
sudo apt remove ruby-sass。运行前请阅读要删除的项目列表,确保它们未被其他项目使用。 - 要删除上面示例中的用户 gem,请使用
gem uninstall --user-install sass -v 3.7.4。无需批量删除其他版本或共享依赖。 - 如果错误是由不兼容的现代 SCSS 语法引起的,仅重新安装可能无法解决。请使用项目所需的实现进行构建,或检查代码以切换到 Dart Sass。
在新环境中切换到 Dart Sass
Sass的当前参考实现是Dart Sass。官方安装文档指导您安装适合您操作系统和CPU的独立版本或npm安装。本节的 npm 示例适用于使用受支持的操作系统并已准备好相应 Sass 版本所需 Node.js 的独立开发环境,并不假定在Ubuntu 16.04的默认Node.js上执行。
一旦Node.js和npm准备就绪,您可以在新的项目文件夹中使用如下命令安装项目特定的开发依赖项。应用到现有项目时,请先备份package.json和锁文件,然后检查现有的构建设置。
npm init -y
npm install --save-dev sass
npx sass --version
npx sass style.scss style.css
在运行最后一个命令之前,您必须将上一部分的 style.scss 保存在同一个文件夹中。npx sass 使用通过此过程安装的项目本地 Sass,可能与全局 sass 命令和版本不同。您可以使用 npm ls sass 和生成的 CSS 来验证安装结果。本示例中添加的开发依赖可以通过 npm uninstall --save-dev sass 删除。
在迁移旧项目时,请在测试分支或副本上比较转换结果,并在应用之前查看 CSS 的差异和警告。您可以在 Dart Sass 命令行文档 中查看单文件转换的命令和选项。安装 Ruby Sass 与迁移到当前 Dart Sass 是两个不同的任务。



