改进此页面

资产

Jekyll 为 Sass 提供内置支持，并可以通过 Ruby gem 与 CoffeeScript 协同工作。要使用它们，你必须首先创建一个具有正确扩展名（.sass、.scss 或 .coffee 之一）的文件，并以两行三破折号开头，如下所示

---
---

// start content
.my-definition
  font-size: 1.2em

Jekyll 将这些文件与常规页面以相同的方式处理，即输出文件将放置在与源文件相同的目录中。例如，如果你的网站源文件夹中有一个名为 css/styles.scss 的文件，Jekyll 将对其进行处理，并将其放置在网站目标文件夹中的 css/styles.css 下。

如果你正在使用 Mustache 或与 Liquid 模板语法冲突的另一种 JavaScript 模板语言，则需要在代码周围放置 {% raw %} 和 {% endraw %} 标记。

Sass/SCSS

Jekyll 允许你以特定方式自定义 Sass 转换。

将所有局部文件放在 sass_dir 中，其默认值为 <source>/_sass。将你的主 SCSS 或 Sass 文件放在你希望它们在输出文件中出现的位置，例如 <source>/css。例如，请参阅此示例网站在 Jekyll 中使用 Sass 支持。

如果你正在使用 Sass @import 语句，则需要确保将 sass_dir 设置为包含 Sass 文件的基目录

sass:
    sass_dir: _sass

Sass 转换器将默认 sass_dir 配置选项设置为 _sass。

请注意，sass_dir 成为 Sass 导入的加载路径，仅此而已。这意味着 Jekyll 不直接了解这些文件。此处任何文件都不应包含如上所述的空前端内容。如果包含，它们将不会按上文所述进行转换。此文件夹应仅包含导入项。

您还可以在 _config.yml 文件中使用 style 选项指定输出样式

sass:
    style: compressed

这些选项传递给 Sass，因此 Sass 支持的任何输出样式选项在此处也同样有效。

有关 Sass 配置选项的更多信息，请参阅 Sass 配置文档。

要在 Jekyll 3.0 及更高版本中启用 Coffeescript，您必须

plugins:
  - jekyll-coffeescript