📦 插件内容页面
Docusaurus的默认页面插件。经典模板附带此插件及其默认配置。此插件提供创建页面功能。
安装
- npm
- Yarn
- pnpm
npm install --save @docusaurus/plugin-content-pages
yarn add @docusaurus/plugin-content-pages
pnpm add @docusaurus/plugin-content-pages
tip
如果你使用预设的@docusaurus/preset-classic，你不需要将此插件作为依赖项安装。
你可以通过预设选项来配置此插件。
配置
接受的字段：
| Name | Type | Default | Description |
|---|---|---|---|
path | string | 'src/pages' | Path to data on filesystem relative to site dir. Components in this directory will be automatically converted to pages. |
routeBasePath | string | '/' | URL route for the pages section of your site. DO NOT include a trailing slash. |
include | string[] | ['**/*.{js,jsx,ts,tsx,md,mdx}'] | Matching files will be included and processed. |
exclude | string[] | See example configuration | No route will be created for matching files. |
mdxPageComponent | string | '@theme/MDXPage' | Component used by each MDX page. |
remarkPlugins | [] | any[] | Remark plugins passed to MDX. |
rehypePlugins | [] | any[] | Rehype plugins passed to MDX. |
beforeDefaultRemarkPlugins | any[] | [] | Custom Remark plugins passed to MDX before the default Docusaurus Remark plugins. |
beforeDefaultRehypePlugins | any[] | [] | Custom Rehype plugins passed to MDX before the default Docusaurus Rehype plugins. |
示例配置
您可以通过预设选项或插件选项来配置此插件。
tip
大多数Docusaurus用户通过预设选项配置此插件。
- 预设选项
- 插件选项
如果您使用预设，请通过预设选项配置此插件：
docusaurus.config.js
module.exports = {
presets: [
[
'@docusaurus/preset-classic',
{
pages: {
path: 'src/pages',
routeBasePath: '',
include: ['**/*.{js,jsx,ts,tsx,md,mdx}'],
exclude: [
'**/_*.{js,jsx,ts,tsx,md,mdx}',
'**/_*/**',
'**/*.test.{js,jsx,ts,tsx}',
'**/__tests__/**',
],
mdxPageComponent: '@theme/MDXPage',
remarkPlugins: [require('remark-math')],
rehypePlugins: [],
beforeDefaultRemarkPlugins: [],
beforeDefaultRehypePlugins: [],
},
},
],
],
};
如果您使用的是独立插件，请直接将选项提供给插件：
docusaurus.config.js
module.exports = {
plugins: [
[
'@docusaurus/plugin-content-pages',
{
path: 'src/pages',
routeBasePath: '',
include: ['**/*.{js,jsx,ts,tsx,md,mdx}'],
exclude: [
'**/_*.{js,jsx,ts,tsx,md,mdx}',
'**/_*/**',
'**/*.test.{js,jsx,ts,tsx}',
'**/__tests__/**',
],
mdxPageComponent: '@theme/MDXPage',
remarkPlugins: [require('remark-math')],
rehypePlugins: [],
beforeDefaultRemarkPlugins: [],
beforeDefaultRehypePlugins: [],
},
],
],
};
国际化
首先阅读i18n介绍。
翻译文件位置
- 基础路径:
website/i18n/[locale]/docusaurus-plugin-content-pages - 多实例路径:
website/i18n/[locale]/docusaurus-plugin-content-pages-[pluginId] - JSON 文件: 使用
docusaurus write-translations提取 - Markdown 文件:
website/i18n/[locale]/docusaurus-plugin-content-pages
示例文件系统结构
website/i18n/[locale]/docusaurus-plugin-content-pages
│
│ # translations for website/src/pages
├── first-markdown-page.md
└── second-markdown-page.md