在前端开发中，我们通常需要对网站进行文档的编写和管理，而 markdown 语言的使用很好地解决了这个问题。而通过使用 metalsmith-markdownit 这个 npm 包，我们可以更加便利地管理和渲染 markdown 文档。
Metalsmith 是什么？
Metalsmith 是一个用于静态网站生成的插件式框架。通过使用插件来完成各种各样的任务，开发者可以轻松管理和生成静态网站的内容。
metalsmith-markdownit 是什么？
metalsmith-markdownit 是一个用于在 Metalsmith 中将 markdown 文档转化为 HTML 的插件。该插件使用了 markdown-it 这个基于 Node.js 的 markdown 解析器。
metalsmith-markdownit 的安装和使用
我们需要先安装和配置 Metalsmith：
npm install -g metalsmith
接着，安装 metalsmith-markdownit：
npm install --save metalsmith-markdownit
在 Metalsmith 中使用该插件：
const Metalsmith = require('metalsmith');
const markdown = require('metalsmith-markdownit');
Metalsmith(__dirname)
.use(markdown())
.build(function(err) {
if (err) throw err;
});以上代码中，我们使用了 metalsmith-markdownit 中的 markdown() 方法来编译 markdown 文档。我们还可以给这个方法传入一些选项来进行更加细致的配置：
-- -------------------- ---- -------
---------------------
---------------
-- ----------- ----
-------- -
----- -----
-------- -----
------------ ----
--
-- -------
---------------- -
-- ------
------- -------------
-- ------
----- --
-
---
-------------------- -
-- ----- ----- ----
---markdown-it 插件选项
markdown-it 是一个基于 Node.js 的 markdown 解析器，而 metalsmith-markdownit 是通过使用该解析器来将 markdown 文档转化为 HTML 的。在使用 markdown-it 时，我们可以向其传入一些选项来进行更加细致的配置。在 metalsmith-markdownit 中，我们可以通过在 markdown 方法的参数中传入一个 options 对象来进行同样的配置。
以下是一些 markdown-it 的配置选项：
html：允许在 markdown 中使用 HTML 代码。linkify：自动转化 URL 和 Email 地址为链接。typographer：启用智能化标点符号。
渲染模板的选项
在上面的代码中，我们没有指定任何渲染模板的选项。然而，如果你需要在转化 markdown 文档为 HTML 时使用模板，那么你可以通过在 markdown 方法的参数中传入一个 rendererOptions 对象来进行模板的渲染。
以下是一些 rendererOptions 的配置选项：
engine：指定使用的模板引擎。vars：指定模板中的变量。
示例代码
以下是一些示例代码，展示了如何使用 metalsmith-markdownit 插件来将 markdown 文档转化为 HTML。
转化单个 markdown 文档
-- -------------------- ---- -------
----- ---------- - ----------------------
----- -------- - ---------------------------------
---------------------
----------------
-----------------------
------------
----------------
-------------------- -
-- ----- ----- ----
---以上代码会将 ./src 目录下的所有 markdown 文档转化为 HTML，并输出到 ./build 目录下。
使用模板来渲染 markdown 文档
-- -------------------- ---- -------
----- ---------- - ----------------------
----- -------- - ---------------------------------
----- ---------- - ----------------------
---------------------
----------------
-----------------------
------------
---------------
---------------- -
------- -------------
----- -
------ --- -----
-
-
---
-------------------- ----------- ------
--- -------- - ----------------------
------------------------------------------
-------------------- - ---------
---
-------
--
-------------------- -
-- ----- ----- ----
---以上代码会将 ./src 目录下的所有 markdown 文档转化为 HTML，并使用 handlebars 模板引擎来渲染 HTML。在模板中，我们可以使用 {title} 变量来展示网站的标题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/78084