Predefinições

As predefinições são coleções de plugins e temas.

Usando predefinições

Uma predefinição geralmente é um pacote npm, então você os instala como outros pacotes npm usando npm.

npm

npm install --save docusaurus-preset-name

Yarn

yarn add docusaurus-preset-name

Em seguida, adicione-o na opção presets do seu site docusaurus.config.js:

docusaurus.config.js

module.exports = {  // ...  presets: ['@docusaurus/preset-xxxx'],};

Para carregar predefinições a partir da sua pasta local, especifique como resolvê-los:

docusaurus.config.js

const path = require('path');
module.exports = {  // ...  presets: [path.resolve(__dirname, '/path/to/docusaurus-local-presets')],};

Predefinições -> temas e plugins

As predefinições são uma função abreviada para adicionar plugins e temas às suas configurações do Docusaurus. Por exemplo, você pode especificar uma predefinição que inclua os seguintes temas e plugins,

module.exports = function preset(context, opts = {}) {  return {    themes: [      require.resolve('@docusaurus/themes-cool'),      require.resolve('@docusaurus/themes-bootstrap'),    ],    plugins: [require.resolve('@docusaurus/plugin-blog')],  };};

então em sua configuração do Docusaurus, você pode configurar a predefinição em vez disso:

docusaurus.config.js

module.exports = {  // ...  presets: ['@docusaurus/preset-my-own'],};

Isso é equivalente a fazer:

docusaurus.config.js

module.exports = {  themes: ['@docusaurus/themes-cool', '@docusaurus/themes-bootstrap'],  plugins: ['@docusaurus/plugin-blog'],};

Isso é especialmente útil quando alguns plugins e temas se destinam a ser usados juntos.

Predefinições oficiais

@docusaurus/preset-classic

A predefinição clássica que geralmente é enviada por padrão para o novo site do Docusaurus. É um conjunto de plugins e temas.

Temas	Plugins
@docusaurus/theme-classic	@docusaurus/plugin-content-docs
@docusaurus/theme-search-algolia	@docusaurus/plugin-content-blog
	@docusaurus/plugin-content-pages
	@docusaurus/plugin-debug
	@docusaurus/plugin-google-analytics
	@docusaurus/plugin-google-gtag
	@docusaurus/plugin-sitemap

Para especificar opções individuais do plugin, você pode fornecer os campos necessários para certos plugins, por exemplo, customCss para @docusaurus/theme-classic, passe-os no campo preset, assim:

docusaurus.config.js

module.exports = {  presets: [    [      '@docusaurus/preset-classic',      {        // Debug defaults to true in dev, false in prod        debug: undefined,        // Will be passed to @docusaurus/theme-classic.        theme: {          customCss: [require.resolve('./src/css/custom.css')],        },        // Will be passed to @docusaurus/plugin-content-docs (false to disable)        docs: {},        // Will be passed to @docusaurus/plugin-content-blog (false to disable)        blog: {},        // Will be passed to @docusaurus/plugin-content-pages (false to disable)        pages: {},        // Will be passed to @docusaurus/plugin-content-sitemap (false to disable)        sitemap: {},      },    ],  ],};

Além desses plugins e temas, @docusaurus/tema clássico adiciona observações como um plugin de observação para @docusaurus/plugin-content-blog e @docusaurus/plugin-content-docs.

A chave admonitions será passada como opções para remark-admonitions. Passar false impedirá que o plugin seja adicionado ao MDX.

docusaurus.config.js

module.exports = {  presets: [    [      '@docusaurus/preset-classic',      {        docs: {          // options for remark-admonitions          admonitions: {},        },      },    ],  ],};

@docusaurus/preset-bootstrap

Uma predefinição alternativa que usa o estilo Bootstrap.

Temas	Plugins
@docusaurus/theme-bootstrap	@docusaurus/plugin-content-docs
	@docusaurus/plugin-content-blog
	@docusaurus/plugin-content-pages
	@docusaurus/plugin-debug

Para especificar opções individuais do plugin, você pode fornecer os campos necessários para certos plugins, por exemplo, docs para @docusaurus/theme-bootstrap, passe-os no campo predefinido, assim:

docusaurus.config.js

module.exports = {  presets: [    [      '@docusaurus/preset-bootstrap',      {        // Debug defaults to true in dev, false in prod        debug: undefined,        // Will be passed to @docusaurus/plugin-content-docs (false to disable)        docs: {},        // Will be passed to @docusaurus/plugin-content-blog (false to disable)        blog: {},      },    ],  ],};

caution

Esta predefinição está em andamento