Metalsmith 是一个静态网站生成器，它使用插件来处理文件。 metalsmith-sense-sass 是一个用于将 sass 文件编译为 css 文件的 Metalsmith 插件。
安装
首先，需要在您的项目中安装 Metalsmith。
npm install metalsmith
接着，需要安装 metalsmith-sense-sass 插件。
npm install metalsmith-sense-sass
使用
在使用 Metalsmith 生成静态网站之前，需要使用 metalsmith-sense-sass 插件将 Sass 文件编译为 CSS 文件。可以在 Metalsmith 的配置文件中引用该插件：
-- -------------------- ---- -------
----- ---------- - ----------------------
----- --------- - ---------------------------------
---------------------
----------------
-----------------------
----------------
------------ -------------
---------- -----
---
---------metalsmith-sense-sass 插件支持以下选项：
outputStyle（默认值：'nested'）:nested,expanded,compact,compressed中的一个值。outputDir（默认值：'.'）: 输出的 CSS 文件所在的目录。
示例
假设有以下目录结构：
- my-project
- src
- styles
- main.sass
- build
- metalsmith.js
- package.json在 my-project/metalsmith.js 中添加以下内容：
const Metalsmith = require('metalsmith');
const senseSass = require('metalsmith-sense-sass');
Metalsmith(__dirname)
.source('./src')
.destination('./build')
.use(senseSass())
.build();然后运行以下命令来生成静态网站：
node metalsmith.js
my-project/src/styles/main.sass 中的 Sass 代码将被编译为 my-project/build/main.css。
结论
使用 metalsmith-sense-sass 可以轻松地将 Sass 文件编译为 CSS 文件，为您的静态网站提供更好的样式支持。此外，Metalsmith 的插件系统使得开发和维护您的静态网站更加容易和简单。
参考
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f411d8e776d08040d73