在web开发中，分页是一个非常常用的功能。如果你正在使用Metalsmith作为静态网站生成器，那么你有很多可能性是使用一个名为metalsmith-collections-paginate的npm包来完成分页功能。本文将介绍如何在你的Metalsmith构建中使用这个npm包，并为你提供一些示例代码，帮助你更好地使用它。
安装
首先，你需要安装与Metalsmith集成的 metalsmith-collections-paginate npm包：
npm install metalsmith-collections-paginate --save-dev
配置
接下来，你需要配置Metalsmith项目以包含这个插件。你可以在Metalsmith的配置文件中进行如下配置：
-- -------------------- ---- -------
----- ----------- - ----------------------------------
----- -------- - -------------------------------------------
---------------------
----------------
-----------------------
------------------
------ -
-------- ------------
-
---
---------------
-------- --
----- -----------------------
------------- -
------ --- -----
-
---
--------------- ----- -
-- ----- ----- ----
---上面的代码假定你的Metalsmith项目已经在./src目录下准备好了。collections插件将创建一个名为posts的集合，其中匹配了posts/*.md文件的所有文件都会被添加到集合中。然后，我们使用paginate插件，将这个集合按照每页5个的方式分页，并用page/:num/index.html路径来展示每一页的内容。在pageMetadata中，我们可以定义一些关于带有分页 posts 的元数据，例如title
值得注意的是，metalsmith-collections-paginate插件需要使用 metalsmith-collections插件，因此你需要在你的Metalsmith项目中安装和配置它 。
示例
下面是一个简单的模板文件，用于显示分页的 posts :
-- -------------------- ---- -------
--------- -----
------
------
--------- -------------- -- - ---- -- ---------- ----- -- ---------- -- -- -- ---------- ----- -- ----------
-------
------
------ -------------- -------
----
--- ---- --------- --
----
------ -------- -------- ------ -------------- -----------
----- ------------- ------
------ ---------------- -------
-----
--- ---- --
-----
--- -- ---------- --
--- ---- ----- --
-- -------- --- ------ ---- ------
--- ---- --
--- -- --
-------
-------上述模板文件将通过页面元数据显示 posts，并显示一个分页导航，让你跳转到你想要的页面。
为了使用这个模板，你需要在你的Metalsmith项目中设置以下选项：
-- -------------------- ---- -------
----------------
--------------
------- -------------
---------- ----------
--------- ----------
---
---------------
-------- --
----- -----------------------
------------- -
------ --- -----
--
--------- --------------------
------ ------------
---在上面的配置中，我们添加了一个名为 paginate.template 的选项，这告诉插件在分页时使用我们的模板文件。在template中，我们使用handlebars模板引擎来传递页面元数据和被分页的文章。我们还将首个页面重定向到 index.html.
总结
通过使用metalsmith-collections-paginate npm包，你可以轻松地向Metalsmith项目添加分页功能。在本文中，我们提供了基本的使用方法和示例代码，以帮助你入门并使用这个插件。希望这对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f3e1d8e776d08040b2d