什么是 metalsmith-atom
metalsmith-atom 是一个基于 Node.js 的静态网站生成工具，可以帮助开发者快速生成优美的静态网站。该工具的最大特点是使用 Markdown 实现内容编写，同时支持大量插件的使用，使得开发者可以高度自定义生成过程，灵活应对不同的需求。
安装与使用
安装 Metalsmith 非常简单，只需通过 npm 来进行安装：
npm install metalsmith --save-dev
在安装 metalsmith-atom 前，请先确保你已安装了 Metalsmith。
metalsmith-atom 的使用非常简单，只需在代码中加入以下几行：
-- -------------------- ---- -------
--- ---------- - ----------------------
--- ---- - ---------------------------
--- -- - ----------------------
---------------
---------------------- -
-- ----- ----- ----
------------------ ----------------
---在上述代码中，我们首先通过 require 引入了 metalsmith-atom，然后新建了一个 Metalsmith 对象，并通过 use 方法来使用了 metalsmith-atom 插件。最后，我们使用 build 方法来构建我们的静态网站。
模板使用
metalsmith-atom 缺省情况下使用同路径下的 template 目录作为模板目录，模板使用 nunjucks 作为模板引擎。
在模板中，可以通过参数 meta 获取变量。meta 对象包含了 Metalsmith 的全部数据。我们可以通过以下方式来输出 meta 中的某些数据：
<p>{{meta.title}}</p>在上述代码中，我们输出了 meta 中的 title 属性。
插件
metalsmith-atom 支持大量的插件，这些插件可以帮助我们进一步定制我们的生成过程。下面我们来介绍一些常见的插件：
metalsmith-markdown
metalsmith-atom 缺省情况下使用 Markdown 作为内容生成方式，但是这种默认的方式缺乏一些必要的扩展。metalsmith-markdown 插件可以帮助我们补充这些扩展，使得我们可以更好的生成我们的内容。
使用方法：
npm install metalsmith-markdown --save-dev
然后在我们的代码中加入以下几行：
var markdown = require('metalsmith-markdown');
ms.use(markdown());这样我们就可以正常使用 Markdown 形式的文章了。
metalsmith-permalinks
这个插件可以帮助我们生成永久链接，使得我们的文章可以长久存在，而不需要担心链接失效问题。
使用方法：
npm install metalsmith-permalinks --save-dev
然后在我们的代码中加入以下几行：
var permalinks = require('metalsmith-permalinks');
ms.use(permalinks({
relative: false
}));这样我们就可以正常生成永久链接了。
metalsmith-sitemap
这个插件可以帮助我们生成 sitemap，使得我们的网站更加搜索引擎友好。
使用方法：
npm install metalsmith-sitemap --save-dev
然后在我们的代码中加入以下几行：
var sitemap = require('metalsmith-sitemap');
ms.use(sitemap({
hostname: 'http://example.com',
changefreq: 'weekly',
priority: 0.5
}));这样我们就可以正常生成 sitemap 了。
案例代码
-- -------------------- ---- -------
--- ---------- - ----------------------
--- -------- - -------------------------------
--- ---------- - ---------------------------------
--- ------- - ------------------------------
--- ---- - ---------------------------
---------------------
-----------
----- -
----- ---------------- --------
-
--
----------------
-----------------------
----------------
------------------
-----------
------------ -
------ ---------------- ------- ------
------- --------------------
------------ -- ---- ----- -- --------------- ---------
--------- ----------------------
--------- -------------------------------
---------- ------------------------------
-
---
--------------
--------- ---------------------
----------- ---------
--------- ---
---
--------------- ----- -
-- ----- ----- ----
---总结
通过以上的文章，我们了解了 metalsmith-atom 的使用方法和常见插件的使用方式。metalsmith-atom 的优点在于可以高度自定义生成过程，且支持大量插件的使用。我们可以通过博客式的方式来构建我们的静态网站，同时也可以通过永久链接和 sitemap 来使得我们的网站更加高效。通过使用 Metalsmith 工具链，我们可以更好地构建我们的前端网站，优化我们的开发体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f431d8e776d08040e25