📦 plugin-content-pages
Le plugin de pages par défaut pour Docusaurus. Le template classic est livré avec ce plugin avec les configurations par défaut. Ce plugin fournit des fonctionnalités de création de pages.
Installation
- npm
- Yarn
- pnpm
npm install --save @docusaurus/plugin-content-pages
yarn add @docusaurus/plugin-content-pages
pnpm add @docusaurus/plugin-content-pages
Si vous utilisez le preset @docusaurus/preset-classic
, vous n'avez pas besoin d'installer ce plugin en tant que dépendance.
Vous pouvez configurer ce plugin via les options du preset.
Configuration
Champs acceptés :
Nom | Type | Par défaut | Description |
---|---|---|---|
path | string | 'src/pages' | Chemin vers les données sur le système de fichiers par rapport au répertoire du site. Les composants de ce répertoire seront automatiquement convertis en pages. |
editUrl | string | EditUrlFn | undefined | Only for Markdown pages. URL de base pour modifier votre site. L'URL finale est calculée par editUrl + relativePostPath . L'utilisation d'une fonction permet un contrôle plus nuancé pour chaque fichier. Omettre cette variable désactivera entièrement les liens de modification. |
editLocalizedFiles | boolean | false | Only for Markdown pages. L'URL de modification ciblera le fichier localisé, au lieu du fichier original non localisé. Ignoré lorsque editUrl est une fonction. |
routeBasePath | string | '/' | Route URL pour la section des pages de votre site. NE PAS inclure un slash de fin. |
include | string[] | ['**/*.{js,jsx,ts,tsx,md,mdx}'] | Les fichiers correspondants seront inclus et traités. |
exclude | string[] | Voir l'exemple de configuration | Aucune route ne sera créée pour les fichiers correspondants. |
mdxPageComponent | string | '@theme/MDXPage' | Composant utilisé par chaque page MDX. |
remarkPlugins | [] | any[] | Plugins Remark passés à MDX. |
rehypePlugins | [] | any[] | Plugins Rehype passés à MDX. |
rehypePlugins | any[] | [] | Recma plugins passed to MDX. |
beforeDefaultRemarkPlugins | any[] | [] | Les plugins Remark personnalisés sont transmis à MDX avant les plugins Remark par défaut de Docusaurus. |
beforeDefaultRehypePlugins | any[] | [] | Les plugins Rehype personnalisés sont transmis à MDX avant les plugins Rehype par défaut de Docusaurus. |
showLastUpdateAuthor | boolean | false | Only for Markdown pages. Whether to display the author who last updated the page. |
showLastUpdateTime | boolean | false | Only for Markdown pages. Whether to display the last date the page post was updated. Cela nécessite l'accès à l'historique git pendant la construction, et ne fonctionnera donc pas correctement avec des clones superficiels (un défaut courant pour les systèmes de CI). With GitHub actions/checkout , usefetch-depth: 0 . |
Types
EditUrlFn
type EditUrlFunction = (params: {
blogDirPath: string;
blogPath: string;
permalink: string;
locale: string;
}) => string | undefined;
Exemple de configuration
Vous pouvez configurer ce plugin via les options du preset ou du plugin.
La plupart des utilisateurs de Docusaurus configurent ce plugin via les options du preset.
- Options du preset
- Options du plugin
Si vous utilisez un preset, configurez ce plugin via le options du preset :
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('./my-remark-plugin')],
rehypePlugins: [],
beforeDefaultRemarkPlugins: [],
beforeDefaultRehypePlugins: [],
},
},
],
],
};
Si vous utilisez un plugin autonome, fournissez des options directement au plugin :
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('./my-remark-plugin')],
rehypePlugins: [],
beforeDefaultRemarkPlugins: [],
beforeDefaultRehypePlugins: [],
},
],
],
};
Front matter du Markdown
Les pages Markdown peuvent utiliser les champs de métadonnées Markdown du front matter suivants, entourés d'une ligne ---
de part et d'autre.
Champs acceptés :
Nom | Type | Par défaut | Description |
---|---|---|---|
title | string | Titre du Markdown | Le titre de l'article du blog. |
description | string | La première ligne du contenu Markdown | La description de votre page qui deviendra <meta name="description" content="..."/> et <meta property="og:description" content="..."/> dans <head> , utilisés par les moteurs de recherche. |
keywords | string[] | undefined | Méta-tag de mots-clés, qui deviendront les <meta name="keywords" content="keyword1,keyword2,..."/> dans <head> , utilisés par les moteurs de recherche. |
image | string | undefined | Cover or thumbnail image that will be used as the <meta property="og:image" content="..."/> in the <head> , enhancing link previews on social media and messaging platforms. |
wrapperClassName | string | Nom de la classe à ajouter à l'élément wrapper pour permettre le ciblage du contenu spécifique de la page. | |
hide_table_of_contents | boolean | false | S'il faut cacher la table des matières à droite. |
draft | boolean | false | Les brouillons de page seront disponibles uniquement lors du développement. |
unlisted | boolean | false | Les pages non listées seront disponibles à la fois en développement et en production. Ils seront « cachés » en production, non indexés, exclus des sitemaps, et ne peuvent être consultés que par les utilisateurs ayant un lien direct. |
Exemple :
---
title: Page Markdown
description: Markdown page SEO description
wrapperClassName: markdown-page
hide_table_of_contents: false
draft: true
---
Contenu de la page Markdown
i18n
Lisez d'abord l'introduction i18n .
Emplacement des fichiers de traduction
- Chemin de base :
website/i18n/[locale]/docusaurus-plugin-content-pages
- Chemin d'accès multi-instance :
website/i18n/[locale]/docusaurus-plugin-content-pages-[pluginId]
- Fichiers JSON : extrait avec
docusaurus write-translations
- Fichiers Markdown :
website/i18n/[locale]/docusaurus-plugin-content-pages
Exemple de structure du système de fichiers
website/i18n/[locale]/docusaurus-plugin-content-pages
│
│ # traductions pour website/src/pages
├── first-markdown-page.md
└── second-markdown-page.md