Metalsmith 是一个静态站点生成器,它使用各种插件来处理不同的任务,包括转换、优化和生成最终的 HTML 文件。其中,metalsmith-collections-archive 插件可以用来归档 Metalsmith 中的集合。
本文将介绍如何使用 metalsmith-collections-archive 插件,并提供示例代码,帮助读者快速上手。
安装 metalsmith-collections-archive
在使用 metalsmith-collections-archive 插件之前,需要先在项目中安装它。可以使用 npm 安装:
npm install metalsmith-collections-archive --save-dev
配置 metalsmith-collections-archive
安装完成后,需要在项目的 Metalsmith 配置文件中添加以下内容:
-- -------------------- ---- ------- -- -------- --- ------------------ - - ------ - ------- ------------ ------- ------- -------- ----- ------ -- ------------ --------------- - -- -- -- ---------------------- - ------------------------------ -- --- ----------- - ---------------------------------- --- ------- - ------------------------------------------ -- -- ---------- ---- --- ---------- - -------------------------------- ------------------------------------- -- -- ----------- -- ---------------------------------- -- -- ------------------- --
以上配置文件中,定义了要归档的集合为 posts,同时指定了归档页面的布局、排序方式、归档文件的路径等信息。
注意:若布局文件(layout)中未添加分页功能,则 limit 参数不起作用,无法实现分页效果。
显示归档页面
归档插件会自动创建归档页面,并在 Metalsmith 的构建结果中添加相应文件。要显示归档页面,可以在模板文件(通常是 index.html 或 archive.html)中添加以下代码:
-- -------------------- ---- ------- ----- --------------- -------- ---------------- ----------------- ---- ------- --------------- ------ ----------------------------- -------------------------- --------- ----- ---------- -------
以上示例代码中,使用了 Handlebars 模板引擎,以展示归档的文章标题、日期等信息。
总结
通过上述步骤,就可以使用 metalsmith-collections-archive 插件来归档 Metalsmith 中的集合,并在生成的 HTML 文件中展示归档页面。
参考文献:
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066f3e1d8e776d08040b1c