前端开发中，我们经常需要制作静态网站，而对于静态网站的生成，我们可以利用一些静态网站生成器。而 metalsmith-comment-yaml 就是其中之一，它可以方便地将 markdown 文件转换成 HTML 文件，同时可以通过 YAML 头部添加评论和其他自定义信息。本文将详细介绍如何使用 metalsmith-comment-yaml。
安装
首先，请确保你已经安装了 Node.js 和 npm。如果没有，你需要先安装。之后，在命令行中输入以下命令进行安装：
npm install --save metalsmith metalsmith-markdown metalsmith-comment-yaml
安装完成后，我们需要创建一个 metalsmith 构建文件。在你的项目根目录下创建一个名为 build.js 的文件，并打开它。
-- -------------------- ---- -------
----- ---------- - ----------------------
----- -------- - -------------------------------
----- ------- - -----------------------------------
---------------------
----------------
-----------------------
----------------
---------------
-------------------- -
-- ----- ----- ----
---通过这个构建文件，我们定义了构建的源和目标目录，并使用了 metalsmith-markdown 和 metalsmith-comment-yaml 两个插件。metalsmith-markdown 用于将 markdown 文件转换成 HTML 文件，metalsmith-comment-yaml 用于添加评论和其他自定义信息。
使用
接下来，我们可以在 markdown 文件的 YAML 头部添加自定义信息，例如评论信息：
--- comments: true --- # 标题 正文
在 YAML 头部，我们可以添加一个 comments 属性，并将其值设置为 true，用于表示这个文件允许评论。使用 metalsmith-comment-yaml 插件，我们可以将评论信息添加到 HTML 文件中。
示例代码
创建一个名为 src/index.md 的 markdown 文件，并添加以下内容：
-- -------------------- ---- ------- --- ------ -- -------- ---- ----- ---------- --------- ---- --- - ------ ------ ---- -- - ------ -------- ----- -- -- ------- -- -- ---------- - ---- - - ---- - - ---- -
保存文件后，在命令行中运行构建命令：
node build.js
构建完成后，将在目标目录 build 中生成一个 HTML 文件。打开该文件，你将会看到添加在 YAML 头部的评论信息已经在 HTML 文件中成功添加。
结论
通过使用 npm 包 metalsmith-comment-yaml，我们可以方便地将 markdown 文件转换成 HTML 文件，并在源文件的 YAML 头部添加自定义信息。这个包的使用方法也十分简单，只需要在 YAML 头部添加相应的属性即可。
同时，我们还可以根据需要使用其他 metalsmith 插件来扩展其功能。这些插件包括但不限于 metalsmith-in-place、metalsmith-layouts 等。对于静态网站的生成，metalsmith-comment-yaml 是一个非常有用的工具，可以帮助我们轻松地构建出优美而完整的静态网站。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f3e1d8e776d08040b4c