npm 包 metalsmith-discover-helpers 使用教程

阅读时长 3 分钟读完

在前端开发中,我们经常需要使用到静态网站生成器(Static Site Generator),比如 Jekyll、Hugo、Metalsmith 等等。这些工具可以帮助我们快速创建静态网站,同时还可以充分利用模板引擎等工具,高效地处理数据。

在处理数据的过程中,我们往往需要使用到一些辅助工具,比如日期格式化库、字符串处理库等等。在 Metalsmith 中,我们可以使用 metalsmith-discover-helpers 这个 npm 包,来自动发现并加载这些辅助工具。

本文将介绍如何使用 metalsmith-discover-helpers 包,包括安装、配置和使用。

安装

使用 npm 安装 metalsmith-discover-helpers 包:

配置

在 Metalsmith 中使用 metalsmith-discover-helpers 包需要进行相关的配置。以下是一个基本的配置示例:

-- -------------------- ---- -------
----- ---------- - ---------------------
----- --------------- - --------------------------------------

---------------------
  --------------
  --------------------
  ----------------------
    ---------- ---------
  ---
  ------------ -- -
    -- ----- ----- ---
  --

在上面的配置中,我们首先引入了 Metalsmith 和 metalsmith-discover-helpers 两个包。然后,我们使用 Metalsmith 创建一个新的实例,并指定了源文件目录和目标文件目录。接着,我们调用了 discoverHelpers 方法,并传入了一个对象参数,其中包含一个 directory 属性,用于指定辅助工具所在的目录。最后,我们调用了 build 方法,构建了静态网站。

在实际使用过程中,还可以在 discoverHelpers 方法中传入多个目录,用于指定多个辅助工具所在的目录:

使用

在配置完成后,我们就可以在模板文件中使用辅助工具了。以 Handlebars 模板引擎为例,我们可以使用 moment 库来格式化时间:

-- -------------------- ---- -------
--------- -----
------

------
  ----- ----------------
  --------- ------------
-------

------
  ----
    ------- -------
    ----
      -- -----------------------------
      -------------- ---- ---------------------
    -----
    ---------
  -----
-------

-------

在上面的模板中,我们首先使用 each 方法遍历所有文章,然后使用 moment 方法来格式化时间。在 moment 方法中,我们传入了要格式化的时间和格式字符串。生成完成后,时间格式将变为 2022-06-22 的形式。

总结

通过本文的介绍,我们了解了如何在 Metalsmith 中使用 metalsmith-discover-helpers 包,自动发现并加载辅助工具。使用这个包可以帮助我们更加方便地处理数据,提高开发效率。希望本文对大家有所帮助。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066f3e1d8e776d08040b5f

纠错
反馈