mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-08 13:52:36 +02:00
refactor(v2): change plugin format within docusaurus.config.js
to be like plugins (#1568)
* refactor(v2): change plugin format within `docusaurus.config.js` to be like presets * docs(v2): mention customizing CSS
This commit is contained in:
parent
0226b892bd
commit
6a905dd736
11 changed files with 221 additions and 242 deletions
|
@ -8,31 +8,14 @@
|
||||||
module.exports = function preset(context, opts = {}) {
|
module.exports = function preset(context, opts = {}) {
|
||||||
return {
|
return {
|
||||||
themes: [
|
themes: [
|
||||||
{
|
['@docusaurus/theme-classic', opts.theme],
|
||||||
module: '@docusaurus/theme-classic',
|
'@docusaurus/theme-search-algolia',
|
||||||
options: opts.theme,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
module: '@docusaurus/theme-search-algolia',
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
plugins: [
|
plugins: [
|
||||||
{
|
['@docusaurus/plugin-content-docs', opts.docs],
|
||||||
module: '@docusaurus/plugin-content-docs',
|
['@docusaurus/plugin-content-blog', opts.blog],
|
||||||
options: opts.docs,
|
['@docusaurus/plugin-content-pages', opts.pages],
|
||||||
},
|
['@docusaurus/plugin-sitemap', opts.sitemap],
|
||||||
{
|
|
||||||
module: '@docusaurus/plugin-content-blog',
|
|
||||||
options: opts.blog,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
module: '@docusaurus/plugin-content-pages',
|
|
||||||
options: opts.pages,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
module: '@docusaurus/plugin-sitemap',
|
|
||||||
options: opts.sitemap,
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
@ -2,9 +2,31 @@
|
||||||
|
|
||||||
## 2.0.0-alpha.19
|
## 2.0.0-alpha.19
|
||||||
|
|
||||||
- Changed plugin definitions from classes to functions. Refer to the new plugin docs.
|
|
||||||
- Added sun and moon emoji to the dark mode toggle.
|
|
||||||
- Add a sensible default for browserslist config.
|
- Add a sensible default for browserslist config.
|
||||||
|
- UI
|
||||||
|
- Added sun and moon emoji to the dark mode toggle.
|
||||||
|
- Mobile responsive menu.
|
||||||
|
- Right table of contents for docs is now sticky.
|
||||||
|
- Plugins
|
||||||
|
- Changed plugin definitions from classes to functions. Refer to the new plugin docs.
|
||||||
|
- Implement Clients module API.
|
||||||
|
- Change format within `docusaurus.config.js` to be like presets.
|
||||||
|
- Infima CSS is now locked down to specific versions and not relying upon the CDN which reads from trunk.
|
||||||
|
- Customize the CSS by passing options into the classic preset:
|
||||||
|
|
||||||
|
```
|
||||||
|
presets: [
|
||||||
|
[
|
||||||
|
'@docusaurus/preset-classic',
|
||||||
|
{
|
||||||
|
theme: {
|
||||||
|
customCss: require.resolve('./css/custom.css'),
|
||||||
|
},
|
||||||
|
...
|
||||||
|
},
|
||||||
|
],
|
||||||
|
],
|
||||||
|
```
|
||||||
|
|
||||||
## V2 Changelog
|
## V2 Changelog
|
||||||
|
|
||||||
|
|
|
@ -14,15 +14,13 @@ module.exports = {
|
||||||
url: 'https://docusaurus.io',
|
url: 'https://docusaurus.io',
|
||||||
favicon: 'img/docusaurus.ico',
|
favicon: 'img/docusaurus.ico',
|
||||||
plugins: [
|
plugins: [
|
||||||
|
[
|
||||||
|
'@docusaurus/plugin-content-docs',
|
||||||
{
|
{
|
||||||
module: '@docusaurus/plugin-content-docs',
|
|
||||||
options: {
|
|
||||||
path: '../docs',
|
path: '../docs',
|
||||||
sidebarPath: require.resolve('./sidebars.json'),
|
sidebarPath: require.resolve('./sidebars.json'),
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
{
|
'@docusaurus/plugin-content-pages',
|
||||||
module: '@docusaurus/plugin-content-pages',
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
|
@ -14,15 +14,13 @@ module.exports = {
|
||||||
url: 'https://docusaurus.io',
|
url: 'https://docusaurus.io',
|
||||||
favicon: 'img/docusaurus.ico',
|
favicon: 'img/docusaurus.ico',
|
||||||
plugins: [
|
plugins: [
|
||||||
|
[
|
||||||
|
'@docusaurus/plugin-content-docs',
|
||||||
{
|
{
|
||||||
module: '@docusaurus/plugin-content-docs',
|
|
||||||
options: {
|
|
||||||
path: '../docs',
|
path: '../docs',
|
||||||
sidebarPath: require.resolve('./sidebars.json'),
|
sidebarPath: require.resolve('./sidebars.json'),
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
{
|
'@docusaurus/plugin-content-pages',
|
||||||
module: '@docusaurus/plugin-content-pages',
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
|
@ -29,10 +29,7 @@ export interface Plugin<T> {
|
||||||
getClientModules?(): string[];
|
getClientModules?(): string[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PluginConfig {
|
export type PluginConfig = [string, Object | undefined] | string;
|
||||||
module: string;
|
|
||||||
options?: Object;
|
|
||||||
}
|
|
||||||
|
|
||||||
export interface PluginContentLoadedActions {
|
export interface PluginContentLoadedActions {
|
||||||
addRoute(config: RouteConfig): void;
|
addRoute(config: RouteConfig): void;
|
||||||
|
@ -50,10 +47,18 @@ export async function loadPlugins({
|
||||||
pluginsRouteConfigs: RouteConfig[];
|
pluginsRouteConfigs: RouteConfig[];
|
||||||
}> {
|
}> {
|
||||||
// 1. Plugin Lifecycle - Initialization/Constructor
|
// 1. Plugin Lifecycle - Initialization/Constructor
|
||||||
const plugins: Plugin<any>[] = pluginConfigs.map(({module, options}) => {
|
const plugins: Plugin<any>[] = pluginConfigs.map(pluginItem => {
|
||||||
|
let pluginModuleImport;
|
||||||
|
let pluginOptions = {};
|
||||||
|
if (typeof pluginItem === 'string') {
|
||||||
|
pluginModuleImport = pluginItem;
|
||||||
|
} else if (Array.isArray(pluginItem)) {
|
||||||
|
pluginModuleImport = pluginItem[0];
|
||||||
|
pluginOptions = pluginItem[1] || {};
|
||||||
|
}
|
||||||
// module is any valid module identifier - npm package or locally-resolved path.
|
// module is any valid module identifier - npm package or locally-resolved path.
|
||||||
const plugin = importFresh(module);
|
const pluginModule = importFresh(pluginModuleImport);
|
||||||
return plugin(context, options);
|
return pluginModule(context, pluginOptions);
|
||||||
});
|
});
|
||||||
|
|
||||||
// 2. Plugin lifecycle - loadContent
|
// 2. Plugin lifecycle - loadContent
|
||||||
|
|
|
@ -1,14 +1,8 @@
|
||||||
module.exports = function preset(context, opts = {}) {
|
module.exports = function preset(context, opts = {}) {
|
||||||
return {
|
return {
|
||||||
plugins: [
|
plugins: [
|
||||||
{
|
['@docusaurus/plugin-content-docs', opts.docs],
|
||||||
name: '@docusaurus/plugin-content-docs',
|
['@docusaurus/plugin-content-blog', opts.blog],
|
||||||
options: opts.docs,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '@docusaurus/plugin-content-blog',
|
|
||||||
options: opts.blog,
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,14 +1,8 @@
|
||||||
module.exports = function preset(context, opts = {}) {
|
module.exports = function preset(context, opts = {}) {
|
||||||
return {
|
return {
|
||||||
plugins: [
|
plugins: [
|
||||||
{
|
['@docusaurus/plugin-content-pages', opts.pages],
|
||||||
name: '@docusaurus/plugin-content-pages',
|
['@docusaurus/plugin-sitemap', opts.sitemap],
|
||||||
options: opts.pages,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '@docusaurus/plugin-sitemap',
|
|
||||||
options: opts.sitemap,
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,16 +1,6 @@
|
||||||
module.exports = function preset(context, opts = {}) {
|
module.exports = function preset(context, opts = {}) {
|
||||||
return {
|
return {
|
||||||
themes: [
|
themes: [['@docusaurus/theme-classic', opts.test]],
|
||||||
{
|
plugins: [['@docusaurus/plugin-test', opts.test]],
|
||||||
name: '@docusaurus/theme-classic',
|
|
||||||
options: opts.test,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
plugins: [
|
|
||||||
{
|
|
||||||
name: '@docusaurus/plugin-test',
|
|
||||||
options: opts.test,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
|
@ -32,14 +32,14 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
"@docusaurus/plugin-content-docs",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -59,22 +59,22 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
"@docusaurus/plugin-content-docs",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-pages",
|
"@docusaurus/plugin-content-pages",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-sitemap",
|
"@docusaurus/plugin-sitemap",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -91,14 +91,14 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
"@docusaurus/plugin-content-docs",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -120,16 +120,16 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-docs",
|
||||||
Object {
|
Object {
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
|
||||||
"options": Object {
|
|
||||||
"path": "../",
|
"path": "../",
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -155,26 +155,26 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-docs",
|
||||||
Object {
|
Object {
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
|
||||||
"options": Object {
|
|
||||||
"path": "../",
|
"path": "../",
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-blog",
|
||||||
|
undefined,
|
||||||
|
],
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-pages",
|
||||||
Object {
|
Object {
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
|
||||||
"options": undefined,
|
|
||||||
},
|
|
||||||
Object {
|
|
||||||
"name": "@docusaurus/plugin-content-pages",
|
|
||||||
"options": Object {
|
|
||||||
"path": "../",
|
"path": "../",
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-sitemap",
|
"@docusaurus/plugin-sitemap",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -197,24 +197,24 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-docs",
|
||||||
Object {
|
Object {
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
|
||||||
"options": Object {
|
|
||||||
"path": "../",
|
"path": "../",
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-pages",
|
"@docusaurus/plugin-content-pages",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-sitemap",
|
"@docusaurus/plugin-sitemap",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [],
|
"themes": Array [],
|
||||||
}
|
}
|
||||||
|
@ -238,34 +238,34 @@ Object {
|
||||||
expect(presets).toMatchInlineSnapshot(`
|
expect(presets).toMatchInlineSnapshot(`
|
||||||
Object {
|
Object {
|
||||||
"plugins": Array [
|
"plugins": Array [
|
||||||
|
Array [
|
||||||
|
"@docusaurus/plugin-content-docs",
|
||||||
Object {
|
Object {
|
||||||
"name": "@docusaurus/plugin-content-docs",
|
|
||||||
"options": Object {
|
|
||||||
"path": "../",
|
"path": "../",
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-blog",
|
"@docusaurus/plugin-content-blog",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-content-pages",
|
"@docusaurus/plugin-content-pages",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-sitemap",
|
"@docusaurus/plugin-sitemap",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/plugin-test",
|
"@docusaurus/plugin-test",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
"themes": Array [
|
"themes": Array [
|
||||||
Object {
|
Array [
|
||||||
"name": "@docusaurus/theme-classic",
|
"@docusaurus/theme-classic",
|
||||||
"options": undefined,
|
undefined,
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
`);
|
`);
|
||||||
|
|
|
@ -16,7 +16,7 @@ export interface Preset {
|
||||||
themes?: PluginConfig[];
|
themes?: PluginConfig[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export type PresetConfig = [string, Object] | string;
|
export type PresetConfig = [string, Object | undefined] | string;
|
||||||
|
|
||||||
export function loadPresets(
|
export function loadPresets(
|
||||||
context: LoadContext,
|
context: LoadContext,
|
||||||
|
@ -34,7 +34,8 @@ export function loadPresets(
|
||||||
if (typeof presetItem === 'string') {
|
if (typeof presetItem === 'string') {
|
||||||
presetModuleImport = presetItem;
|
presetModuleImport = presetItem;
|
||||||
} else if (Array.isArray(presetItem)) {
|
} else if (Array.isArray(presetItem)) {
|
||||||
[presetModuleImport, presetOptions] = presetItem;
|
presetModuleImport = presetItem[0];
|
||||||
|
presetOptions = presetItem[1] || {};
|
||||||
}
|
}
|
||||||
|
|
||||||
const presetModule = importFresh(presetModuleImport);
|
const presetModule = importFresh(presetModuleImport);
|
||||||
|
|
|
@ -18,17 +18,15 @@ Then you add it in your site's `docusaurus.config.js` plugin arrays:
|
||||||
```jsx
|
```jsx
|
||||||
module.exports = {
|
module.exports = {
|
||||||
plugins: [
|
plugins: [
|
||||||
{
|
'@docusaurus/plugin-content-pages',
|
||||||
module: '@docusaurus/plugin-content-pages',
|
[
|
||||||
},
|
|
||||||
{
|
|
||||||
// Plugin with options
|
// Plugin with options
|
||||||
module: '@docusaurus/plugin-content-blog',
|
'@docusaurus/plugin-content-blog',
|
||||||
options: {
|
{
|
||||||
include: ['*.md', '*.mdx'],
|
include: ['*.md', '*.mdx'],
|
||||||
path: 'blog',
|
path: 'blog',
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
@ -39,11 +37,7 @@ Docusaurus can also load plugins from your local directory, you can do something
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
plugins: [
|
plugins: [path.resolve(__dirname, '/path/to/docusaurus-local-plugin')],
|
||||||
{
|
|
||||||
module: path.resolve(__dirname, '/path/to/docusaurus-local-plugin'),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue