当我们在开发 Gatsby 网站时，一般会按照页面类型创建对应的文件夹和文件，如页面组件、样式和背景图等， 这样做可以更好地组织整个项目。但是，如果你要创建多个页面， 维护会变得非常麻烦。此时，Gatsby-plugin-page-creator 插件就派上了用场了。
什么是 Gatsby-plugin-page-creator？
Gatsby-plugin-page-creator 是一个官方提供的 Gatsby 插件， 它提供了一种自动化创建页面的方式， 开发者只需要在指定的目录中创建一个页面组件， 就可以自动创建一个路由和页面。 这个插件的主要作用是让你可以快速地创建多个页面， 然后使用它们来构建 Gatsby 的模板。
如何使用 Gatsby-plugin-page-creator？
首先，我们需要安装此插件：
--- - --------------------------
然后，我们需要在 Gatsby 的配置文件 gatsby-config.js 中配置该插件：
-------------- - -
------------- -
------ --- ------ ------
--
-------- -
-- -----
-----------------------------
--
--默认情况下，此插件会在 src/pages 目录中自动查找所有组件并创建相应的路由。可以通过以下方式自定义页面路径：
-------------- - -
------------- -
------ --- ------ ------
--
-------- -
-
-- -----
-------- -----------------------------
-------- -
----- ------------------------------
--
--
--
--上面代码中，我们设置了自动创建路由的路径为 src/containers。
示例代码
下面是一个基本的示例，让你更好地理解 Gatsby-plugin-page-creator 的用法。 假设我们有以下目录结构：
----
--- ------
- --- --------
--- -----------
--- --------
--- ----------在以上目录结构中， 我们把 about.js 和 contact.js 放在了 src/containers 目录下， 然后将路由自动化配置为读取该目录：
-------------- - -
------------- -
------ --- ------ ------
--
-------- -
-
-- -----
-------- -----------------------------
-------- -
----- ------------------------------
--
--
--
--这样配置后， Gatsby-plugin-page-creator 会自动读取 src/containers 目录下的所有组件，并自动创建相应的路由。 比如说， about.js 会自动创建 /about 路由。
关于 index.js 我们不用特殊配置， 默认情况下 Gatsby-plugin-page-creator 会自动为你创建一个首页路由， index.js 的路径即 http://localhost:8000。
总结
本文介绍了 Gatsby-plugin-page-creator 插件的用法， 它可以让我们自动化创建路由和页面， 大大地减少了维护的难度。 我们希望本文可以对你理解和使用该插件有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/gatsby-plugin-page-creator