3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-10 15:47:23 +02:00
Code Issues Projects Releases Packages Wiki Activity

chore(v2): prepare v2.0.0-beta.14 release (#6147)

Browse source
This commit is contained in:
Sébastien Lorber 2021-12-21 17:15:04 +01:00 • committed by GitHub
parent cc0a439e12
commit 01b407011a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
118 changed files with 2121 additions and 1456 deletions
Download patch file Download diff file Expand all files Collapse all files

1
.prettierignore
View file

@ -15,5 +15,6 @@ __fixtures__
website/i18n website/i18n
website/versions.json website/versions.json
website/docusaurus.config.js website/docusaurus.config.js
website/versioned_sidebars/*.json
examples/ examples/

95
CHANGELOG.md
View file

@ -1,5 +1,100 @@
# Docusaurus 2 Changelog # Docusaurus 2 Changelog
## 2.0.0-beta.14 (2021-12-21)
#### :rocket: New Feature
- `docusaurus-theme-classic`, `docusaurus-theme-common`
- [#6132](https://github.com/facebook/docusaurus/pull/6132) feat(theme-classic): new configuration syntax for a simple footer ([@christopherklint97](https://github.com/christopherklint97))
- [#6125](https://github.com/facebook/docusaurus/pull/6125) feat(theme-common): stable classname for code blocks ([@Josh-Cena](https://github.com/Josh-Cena))
- `docusaurus-theme-classic`
- [#5848](https://github.com/facebook/docusaurus/pull/5848) feat(theme-classic): standalone Admonition component ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6082](https://github.com/facebook/docusaurus/pull/6082) feat(theme-classic): allow passing additional attributes to tab headings ([@Drylozu](https://github.com/Drylozu))
- `docusaurus-plugin-content-blog`
- [#6126](https://github.com/facebook/docusaurus/pull/6126) feat(content-blog): support json feed ([@notzheng](https://github.com/notzheng))
- `docusaurus`
- [#6107](https://github.com/facebook/docusaurus/pull/6107) feat(core): allow plugins to customize/override Webpack devServer config ([@slorber](https://github.com/slorber))
#### :bug: Bug Fix
- `docusaurus-migrate`
- [#6146](https://github.com/facebook/docusaurus/pull/6146) fix(migrate): do not modify non-MD files ([@Josh-Cena](https://github.com/Josh-Cena))
- `docusaurus-theme-classic`
- [#6128](https://github.com/facebook/docusaurus/pull/6128) fix: do not use aria-hidden in heading anchor links ([@lex111](https://github.com/lex111))
- `docusaurus-plugin-content-docs`
- [#6124](https://github.com/facebook/docusaurus/pull/6124) fix(content-docs): restore behavior when pagination front matter is null ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6085](https://github.com/facebook/docusaurus/pull/6085) fix(content-docs): getMainDocId should return doc with both versioned or unversioned id ([@slorber](https://github.com/slorber))
- `docusaurus-theme-classic`, `docusaurus-utils-validation`
- [#6097](https://github.com/facebook/docusaurus/pull/6097) fix: declare missing dependencies ([@merceyz](https://github.com/merceyz))
- `docusaurus-plugin-google-analytics`, `docusaurus-plugin-google-gtag`, `docusaurus-plugin-pwa`, `docusaurus-remark-plugin-npm2yarn`, `docusaurus-theme-live-codeblock`, `docusaurus-theme-search-algolia`, `lqip-loader`
- [#6094](https://github.com/facebook/docusaurus/pull/6094) fix: add missing dependencies on tslib ([@Josh-Cena](https://github.com/Josh-Cena))
- `docusaurus-theme-translations`
- [#6088](https://github.com/facebook/docusaurus/pull/6088) fix(theme-translations): publish theme-translation lib, including typedef ([@slorber](https://github.com/slorber))
#### :nail_care: Polish
- `docusaurus-theme-classic`
- [#6053](https://github.com/facebook/docusaurus/pull/6053) feat(theme-classic): allow stylizing doc paginator arrows ([@noomorph](https://github.com/noomorph))
- [#6121](https://github.com/facebook/docusaurus/pull/6121) fix(theme-classic): add outline to focused code blocks ([@christopherklint97](https://github.com/christopherklint97))
- [#6118](https://github.com/facebook/docusaurus/pull/6118) refactor: remove some useless code ([@lex111](https://github.com/lex111))
- `create-docusaurus`, `docusaurus-logger`, `docusaurus-mdx-loader`, `docusaurus-migrate`, `docusaurus-plugin-client-redirects`, `docusaurus-plugin-content-blog`, `docusaurus-plugin-content-docs`, `docusaurus-theme-classic`, `docusaurus-theme-search-algolia`, `docusaurus-theme-translations`, `docusaurus-utils-validation`, `docusaurus-utils`, `docusaurus`
- [#5994](https://github.com/facebook/docusaurus/pull/5994) refactor: unify log format with new logger utility ([@Josh-Cena](https://github.com/Josh-Cena))
- `create-docusaurus`
- [#6119](https://github.com/facebook/docusaurus/pull/6119) fix(create-docusaurus): make initial editUrl functional ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6095](https://github.com/facebook/docusaurus/pull/6095) fix(create-docusaurus): give a clearer message when installation failed ([@Josh-Cena](https://github.com/Josh-Cena))
#### :memo: Documentation
- [#6142](https://github.com/facebook/docusaurus/pull/6142) docs: normalize usage of placeholders ([@Josh-Cena](https://github.com/Josh-Cena))
- [#5918](https://github.com/facebook/docusaurus/pull/5918) docs: refactor & refine lifecycle API docs ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6138](https://github.com/facebook/docusaurus/pull/6138) docs: add Smart Docs to showcase ([@wowtvds](https://github.com/wowtvds))
- [#6137](https://github.com/facebook/docusaurus/pull/6137) docs: add ToolJet to showcase ([@withshubh](https://github.com/withshubh))
- [#6141](https://github.com/facebook/docusaurus/pull/6141) docs: add WoodpeckerCI to showcase ([@6543](https://github.com/6543))
- [#6135](https://github.com/facebook/docusaurus/pull/6135) docs: mention admonition quirks with Prettier ([@yangshun](https://github.com/yangshun))
- [#6131](https://github.com/facebook/docusaurus/pull/6131) docs: elaborate on "docs-only" and "blog-only" ([@himanshu007-creator](https://github.com/himanshu007-creator))
- [#6134](https://github.com/facebook/docusaurus/pull/6134) docs: update link to init template README.md ([@cmpadden](https://github.com/cmpadden))
- [#6130](https://github.com/facebook/docusaurus/pull/6130) docs: refactor docs sidebar doc ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6129](https://github.com/facebook/docusaurus/pull/6129) docs: refactor styling/theming docs ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6112](https://github.com/facebook/docusaurus/pull/6112) docs: mention that SEO through front matter is better than head tag ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6120](https://github.com/facebook/docusaurus/pull/6120) refactor(website): make deploy preview open next version docs by default ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6111](https://github.com/facebook/docusaurus/pull/6111) docs: add Molecule website to showcase ([@wewoor](https://github.com/wewoor))
- [#6089](https://github.com/facebook/docusaurus/pull/6089) docs: add Enarx website to showcase ([@HarshCasper](https://github.com/HarshCasper))
- [#6090](https://github.com/facebook/docusaurus/pull/6090) docs: add sapphire to showcase ([@favna](https://github.com/favna))
- [#6091](https://github.com/facebook/docusaurus/pull/6091) docs(showcase): "much more pages" => "many more pages" ([@favna](https://github.com/favna))
#### :house: Internal
- `docusaurus-theme-classic`
- [#6144](https://github.com/facebook/docusaurus/pull/6144) fix(theme-classic): fix translation when footer has no links ([@Josh-Cena](https://github.com/Josh-Cena))
- `docusaurus-plugin-content-docs`
- [#6143](https://github.com/facebook/docusaurus/pull/6143) test: fix async tests resolved in random order ([@Josh-Cena](https://github.com/Josh-Cena))
- [#6123](https://github.com/facebook/docusaurus/pull/6123) test: use snapshots for sidebar tests ([@Josh-Cena](https://github.com/Josh-Cena))
- Other
- [#6122](https://github.com/facebook/docusaurus/pull/6122) fix(website): fix yarn build:website:fast ([@slorber](https://github.com/slorber))
- [#6080](https://github.com/facebook/docusaurus/pull/6080) chore: add NPM and PNPM to E2E tests ([@Josh-Cena](https://github.com/Josh-Cena))
- `create-docusaurus`, `docusaurus-cssnano-preset`, `docusaurus-mdx-loader`, `docusaurus-migrate`, `docusaurus-plugin-client-redirects`, `docusaurus-plugin-content-blog`, `docusaurus-plugin-content-docs`, `docusaurus-plugin-content-pages`, `docusaurus-plugin-debug`, `docusaurus-plugin-google-analytics`, `docusaurus-plugin-google-gtag`, `docusaurus-plugin-ideal-image`, `docusaurus-plugin-pwa`, `docusaurus-plugin-sitemap`, `docusaurus-preset-classic`, `docusaurus-remark-plugin-npm2yarn`, `docusaurus-theme-classic`, `docusaurus-theme-common`, `docusaurus-theme-live-codeblock`, `docusaurus-theme-search-algolia`, `docusaurus-theme-translations`, `docusaurus-types`, `docusaurus-utils-common`, `docusaurus-utils-validation`, `docusaurus-utils`, `docusaurus`, `lqip-loader`
- [#6092](https://github.com/facebook/docusaurus/pull/6092) misc: ignore some files during npm publish ([@Josh-Cena](https://github.com/Josh-Cena))
#### Committers: 17
- 6543 ([@6543](https://github.com/6543))
- Alexey Pyltsyn ([@lex111](https://github.com/lex111))
- Christopher Klint ([@christopherklint97](https://github.com/christopherklint97))
- Harsh Mishra ([@HarshCasper](https://github.com/HarshCasper))
- Himanshu ([@himanshu007-creator](https://github.com/himanshu007-creator))
- Jeroen Claassens ([@favna](https://github.com/favna))
- Joshua Chen ([@Josh-Cena](https://github.com/Josh-Cena))
- Kristoffer K. ([@merceyz](https://github.com/merceyz))
- Shubhendra Singh Chauhan ([@withshubh](https://github.com/withshubh))
- Sébastien Lorber ([@slorber](https://github.com/slorber))
- Wout Vandesompele ([@wowtvds](https://github.com/wowtvds))
- Yangshun Tay ([@yangshun](https://github.com/yangshun))
- Yaroslav Serhieiev ([@noomorph](https://github.com/noomorph))
- Ziv ([@wewoor](https://github.com/wewoor))
- [@Drylozu](https://github.com/Drylozu)
- colton ([@cmpadden](https://github.com/cmpadden))
- 不郑 ([@notzheng](https://github.com/notzheng))
## 2.0.0-beta.13 (2021-12-10) ## 2.0.0-beta.13 (2021-12-10)
Good npm publish, same code as beta.11 Good npm publish, same code as beta.11

2
admin/new.docusaurus.io/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "new.docusaurus.io", "name": "new.docusaurus.io",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"private": true, "private": true,
"scripts": { "scripts": {
"start": "netlify dev" "start": "netlify dev"

2
lerna.json
View file

@ -1,5 +1,5 @@
{ {
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"npmClient": "yarn", "npmClient": "yarn",
"useWorkspaces": true, "useWorkspaces": true,
"changelog": { "changelog": {

4
packages/create-docusaurus/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "create-docusaurus", "name": "create-docusaurus",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Create Docusaurus apps easily.", "description": "Create Docusaurus apps easily.",
"repository": { "repository": {
"type": "git", "type": "git",
@ -23,7 +23,7 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"commander": "^5.1.0", "commander": "^5.1.0",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
"lodash": "^4.17.20", "lodash": "^4.17.20",

8
packages/create-docusaurus/templates/classic-typescript/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "docusaurus-2-classic-typescript-template", "name": "docusaurus-2-classic-typescript-template",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"private": true, "private": true,
"scripts": { "scripts": {
"docusaurus": "docusaurus", "docusaurus": "docusaurus",
@ -15,8 +15,8 @@
"typecheck": "tsc" "typecheck": "tsc"
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/preset-classic": "2.0.0-beta.13", "@docusaurus/preset-classic": "2.0.0-beta.14",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"prism-react-renderer": "^1.2.1", "prism-react-renderer": "^1.2.1",
@ -24,7 +24,7 @@
"react-dom": "^17.0.1" "react-dom": "^17.0.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"@tsconfig/docusaurus": "^1.0.4", "@tsconfig/docusaurus": "^1.0.4",
"typescript": "^4.5.2" "typescript": "^4.5.2"
}, },

6
packages/create-docusaurus/templates/classic/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "docusaurus-2-classic-template", "name": "docusaurus-2-classic-template",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"private": true, "private": true,
"scripts": { "scripts": {
"docusaurus": "docusaurus", "docusaurus": "docusaurus",
@ -14,8 +14,8 @@
"write-heading-ids": "docusaurus write-heading-ids" "write-heading-ids": "docusaurus write-heading-ids"
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/preset-classic": "2.0.0-beta.13", "@docusaurus/preset-classic": "2.0.0-beta.14",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"prism-react-renderer": "^1.2.1", "prism-react-renderer": "^1.2.1",

6
packages/create-docusaurus/templates/facebook/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "docusaurus-2-facebook-template", "name": "docusaurus-2-facebook-template",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"private": true, "private": true,
"scripts": { "scripts": {
"docusaurus": "docusaurus", "docusaurus": "docusaurus",
@ -18,8 +18,8 @@
"format:diff": "prettier --config .prettierrc --list-different \"**/*.{js,jsx,ts,tsx,md,mdx}\"" "format:diff": "prettier --config .prettierrc --list-different \"**/*.{js,jsx,ts,tsx,md,mdx}\""
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/preset-classic": "2.0.0-beta.13", "@docusaurus/preset-classic": "2.0.0-beta.14",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"react": "^17.0.1", "react": "^17.0.1",

2
packages/docusaurus-cssnano-preset/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/cssnano-preset", "name": "@docusaurus/cssnano-preset",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Advanced cssnano preset for maximum optimization.", "description": "Advanced cssnano preset for maximum optimization.",
"main": "index.js", "main": "index.js",
"license": "MIT", "license": "MIT",

2
packages/docusaurus-logger/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/logger", "name": "@docusaurus/logger",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "An encapsulated logger for semantically formatting console messages.", "description": "An encapsulated logger for semantically formatting console messages.",
"main": "./lib/index.js", "main": "./lib/index.js",
"repository": { "repository": {

8
packages/docusaurus-mdx-loader/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/mdx-loader", "name": "@docusaurus/mdx-loader",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus Loader for MDX", "description": "Docusaurus Loader for MDX",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/mdx-loader.d.ts", "types": "src/mdx-loader.d.ts",
@ -20,8 +20,8 @@
"dependencies": { "dependencies": {
"@babel/parser": "^7.16.4", "@babel/parser": "^7.16.4",
"@babel/traverse": "^7.16.3", "@babel/traverse": "^7.16.3",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@mdx-js/mdx": "^1.6.21", "@mdx-js/mdx": "^1.6.21",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"escape-html": "^1.0.3", "escape-html": "^1.0.3",
@ -37,7 +37,7 @@
"webpack": "^5.61.0" "webpack": "^5.61.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/escape-html": "^1.0.1", "@types/escape-html": "^1.0.1",
"@types/mdast": "^3.0.7", "@types/mdast": "^3.0.7",
"@types/stringify-object": "^3.3.1", "@types/stringify-object": "^3.3.1",

4
packages/docusaurus-migrate/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/migrate", "name": "@docusaurus/migrate",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "A CLI tool to migrate from older versions of Docusaurus.", "description": "A CLI tool to migrate from older versions of Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"license": "MIT", "license": "MIT",
@ -24,7 +24,7 @@
}, },
"dependencies": { "dependencies": {
"@babel/preset-env": "^7.16.4", "@babel/preset-env": "^7.16.4",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@mapbox/hast-util-to-jsx": "^1.0.0", "@mapbox/hast-util-to-jsx": "^1.0.0",
"color": "^4.0.1", "color": "^4.0.1",
"commander": "^5.1.0", "commander": "^5.1.0",

4
packages/docusaurus-module-type-aliases/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/module-type-aliases", "name": "@docusaurus/module-type-aliases",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus module type aliases.", "description": "Docusaurus module type aliases.",
"types": "./src/index.d.ts", "types": "./src/index.d.ts",
"publishConfig": { "publishConfig": {
@ -12,7 +12,7 @@
"directory": "packages/docusaurus-module-type-aliases" "directory": "packages/docusaurus-module-type-aliases"
}, },
"dependencies": { "dependencies": {
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/react": "*", "@types/react": "*",
"@types/react-helmet": "*", "@types/react-helmet": "*",
"@types/react-router-config": "*", "@types/react-router-config": "*",

14
packages/docusaurus-plugin-client-redirects/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-client-redirects", "name": "@docusaurus/plugin-client-redirects",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Client redirects plugin for Docusaurus.", "description": "Client redirects plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-client-redirects.d.ts", "types": "src/plugin-client-redirects.d.ts",
@ -18,11 +18,11 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-common": "2.0.0-beta.13", "@docusaurus/utils-common": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"chalk": "^4.1.2", "chalk": "^4.1.2",
"eta": "^1.12.3", "eta": "^1.12.3",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
@ -30,7 +30,7 @@
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

14
packages/docusaurus-plugin-content-blog/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-content-blog", "name": "@docusaurus/plugin-content-blog",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Blog plugin for Docusaurus.", "description": "Blog plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-content-blog.d.ts", "types": "src/plugin-content-blog.d.ts",
@ -18,11 +18,11 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/mdx-loader": "2.0.0-beta.13", "@docusaurus/mdx-loader": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"escape-string-regexp": "^4.0.0", "escape-string-regexp": "^4.0.0",
"feed": "^4.2.2", "feed": "^4.2.2",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
@ -37,7 +37,7 @@
"webpack": "^5.61.0" "webpack": "^5.61.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

16
packages/docusaurus-plugin-content-docs/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-content-docs", "name": "@docusaurus/plugin-content-docs",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docs plugin for Docusaurus.", "description": "Docs plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-content-docs.d.ts", "types": "src/plugin-content-docs.d.ts",
@ -18,11 +18,11 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/mdx-loader": "2.0.0-beta.13", "@docusaurus/mdx-loader": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"combine-promises": "^1.1.0", "combine-promises": "^1.1.0",
"escape-string-regexp": "^4.0.0", "escape-string-regexp": "^4.0.0",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
@ -38,8 +38,8 @@
"webpack": "^5.61.0" "webpack": "^5.61.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/js-yaml": "^4.0.0", "@types/js-yaml": "^4.0.0",
"@types/picomatch": "^2.2.1", "@types/picomatch": "^2.2.1",
"commander": "^5.1.0", "commander": "^5.1.0",

12
packages/docusaurus-plugin-content-pages/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-content-pages", "name": "@docusaurus/plugin-content-pages",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Pages plugin for Docusaurus.", "description": "Pages plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-content-pages.d.ts", "types": "src/plugin-content-pages.d.ts",
@ -18,17 +18,17 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/mdx-loader": "2.0.0-beta.13", "@docusaurus/mdx-loader": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"globby": "^11.0.2", "globby": "^11.0.2",
"remark-admonitions": "^1.2.1", "remark-admonitions": "^1.2.1",
"tslib": "^2.3.1", "tslib": "^2.3.1",
"webpack": "^5.61.0" "webpack": "^5.61.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

8
packages/docusaurus-plugin-debug/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-debug", "name": "@docusaurus/plugin-debug",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Debug plugin for Docusaurus.", "description": "Debug plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-debug.d.ts", "types": "src/plugin-debug.d.ts",
@ -18,14 +18,14 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
"react-json-view": "^1.21.3", "react-json-view": "^1.21.3",
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

8
packages/docusaurus-plugin-google-analytics/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-google-analytics", "name": "@docusaurus/plugin-google-analytics",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Global analytics (analytics.js) plugin for Docusaurus.", "description": "Global analytics (analytics.js) plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-google-analytics.d.ts", "types": "src/plugin-google-analytics.d.ts",
@ -18,12 +18,12 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

8
packages/docusaurus-plugin-google-gtag/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-google-gtag", "name": "@docusaurus/plugin-google-gtag",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Global Site Tag (gtag.js) plugin for Docusaurus.", "description": "Global Site Tag (gtag.js) plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-google-gtag.d.ts", "types": "src/plugin-google-gtag.d.ts",
@ -18,12 +18,12 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

8
packages/docusaurus-plugin-ideal-image/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-ideal-image", "name": "@docusaurus/plugin-ideal-image",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus Plugin to generate an almost ideal image (responsive, lazy-loading, and low quality placeholder).", "description": "Docusaurus Plugin to generate an almost ideal image (responsive, lazy-loading, and low quality placeholder).",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-ideal-image.d.ts", "types": "src/plugin-ideal-image.d.ts",
@ -21,8 +21,8 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/lqip-loader": "2.0.0-beta.13", "@docusaurus/lqip-loader": "2.0.0-beta.14",
"@docusaurus/responsive-loader": "1.5.0", "@docusaurus/responsive-loader": "1.5.0",
"@endiliey/react-ideal-image": "^0.0.11", "@endiliey/react-ideal-image": "^0.0.11",
"react-waypoint": "^10.1.0", "react-waypoint": "^10.1.0",
@ -31,7 +31,7 @@
"webpack": "^5.61.0" "webpack": "^5.61.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"fs-extra": "^10.0.0" "fs-extra": "^10.0.0"
}, },
"peerDependencies": { "peerDependencies": {

14
packages/docusaurus-plugin-pwa/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-pwa", "name": "@docusaurus/plugin-pwa",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus Plugin to add PWA support.", "description": "Docusaurus Plugin to add PWA support.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-pwa.d.ts", "types": "src/plugin-pwa.d.ts",
@ -23,11 +23,11 @@
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.0", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.0",
"@babel/plugin-proposal-optional-chaining": "^7.16.0", "@babel/plugin-proposal-optional-chaining": "^7.16.0",
"@babel/preset-env": "^7.16.4", "@babel/preset-env": "^7.16.4",
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/theme-common": "2.0.0-beta.13", "@docusaurus/theme-common": "2.0.0-beta.14",
"@docusaurus/theme-translations": "2.0.0-beta.13", "@docusaurus/theme-translations": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"babel-loader": "^8.2.2", "babel-loader": "^8.2.2",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"core-js": "^3.18.0", "core-js": "^3.18.0",
@ -40,7 +40,7 @@
"workbox-window": "^6.1.1" "workbox-window": "^6.1.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"fs-extra": "^10.0.0" "fs-extra": "^10.0.0"
}, },
"peerDependencies": { "peerDependencies": {

12
packages/docusaurus-plugin-sitemap/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/plugin-sitemap", "name": "@docusaurus/plugin-sitemap",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Simple sitemap generation plugin for Docusaurus.", "description": "Simple sitemap generation plugin for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/plugin-sitemap.d.ts", "types": "src/plugin-sitemap.d.ts",
@ -18,16 +18,16 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-common": "2.0.0-beta.13", "@docusaurus/utils-common": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
"sitemap": "^7.0.0", "sitemap": "^7.0.0",
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

22
packages/docusaurus-preset-classic/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/preset-classic", "name": "@docusaurus/preset-classic",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Classic preset for Docusaurus.", "description": "Classic preset for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/preset-classic.d.ts", "types": "src/preset-classic.d.ts",
@ -18,16 +18,16 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/plugin-content-blog": "2.0.0-beta.13", "@docusaurus/plugin-content-blog": "2.0.0-beta.14",
"@docusaurus/plugin-content-docs": "2.0.0-beta.13", "@docusaurus/plugin-content-docs": "2.0.0-beta.14",
"@docusaurus/plugin-content-pages": "2.0.0-beta.13", "@docusaurus/plugin-content-pages": "2.0.0-beta.14",
"@docusaurus/plugin-debug": "2.0.0-beta.13", "@docusaurus/plugin-debug": "2.0.0-beta.14",
"@docusaurus/plugin-google-analytics": "2.0.0-beta.13", "@docusaurus/plugin-google-analytics": "2.0.0-beta.14",
"@docusaurus/plugin-google-gtag": "2.0.0-beta.13", "@docusaurus/plugin-google-gtag": "2.0.0-beta.14",
"@docusaurus/plugin-sitemap": "2.0.0-beta.13", "@docusaurus/plugin-sitemap": "2.0.0-beta.14",
"@docusaurus/theme-classic": "2.0.0-beta.13", "@docusaurus/theme-classic": "2.0.0-beta.14",
"@docusaurus/theme-search-algolia": "2.0.0-beta.13" "@docusaurus/theme-search-algolia": "2.0.0-beta.14"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16.8.4 || ^17.0.0", "react": "^16.8.4 || ^17.0.0",

2
packages/docusaurus-remark-plugin-npm2yarn/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/remark-plugin-npm2yarn", "name": "@docusaurus/remark-plugin-npm2yarn",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Remark plugin for converting npm commands to Yarn commands as tabs.", "description": "Remark plugin for converting npm commands to Yarn commands as tabs.",
"main": "lib/index.js", "main": "lib/index.js",
"publishConfig": { "publishConfig": {

22
packages/docusaurus-theme-classic/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/theme-classic", "name": "@docusaurus/theme-classic",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Classic theme for Docusaurus", "description": "Classic theme for Docusaurus",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/theme-classic.d.ts", "types": "src/theme-classic.d.ts",
@ -23,14 +23,14 @@
"update-code-translations": "node -e 'require(\"./update-code-translations.js\").run()'" "update-code-translations": "node -e 'require(\"./update-code-translations.js\").run()'"
}, },
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/plugin-content-blog": "2.0.0-beta.13", "@docusaurus/plugin-content-blog": "2.0.0-beta.14",
"@docusaurus/plugin-content-docs": "2.0.0-beta.13", "@docusaurus/plugin-content-docs": "2.0.0-beta.14",
"@docusaurus/plugin-content-pages": "2.0.0-beta.13", "@docusaurus/plugin-content-pages": "2.0.0-beta.14",
"@docusaurus/theme-common": "2.0.0-beta.13", "@docusaurus/theme-common": "2.0.0-beta.14",
"@docusaurus/theme-translations": "2.0.0-beta.13", "@docusaurus/theme-translations": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"@mdx-js/mdx": "^1.6.21", "@mdx-js/mdx": "^1.6.21",
"@mdx-js/react": "^1.6.21", "@mdx-js/react": "^1.6.21",
"clsx": "^1.1.1", "clsx": "^1.1.1",
@ -45,8 +45,8 @@
"rtlcss": "^3.3.0" "rtlcss": "^3.3.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/mdx-js__react": "^1.5.4", "@types/mdx-js__react": "^1.5.4",
"@types/parse-numeric-range": "^0.0.1", "@types/parse-numeric-range": "^0.0.1",
"@types/rtlcss": "^3.1.1", "@types/rtlcss": "^3.1.1",

14
packages/docusaurus-theme-common/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/theme-common", "name": "@docusaurus/theme-common",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Common code for Docusaurus themes.", "description": "Common code for Docusaurus themes.",
"main": "./lib/index.js", "main": "./lib/index.js",
"types": "./lib/index.d.ts", "types": "./lib/index.d.ts",
@ -18,9 +18,9 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/plugin-content-blog": "2.0.0-beta.13", "@docusaurus/plugin-content-blog": "2.0.0-beta.14",
"@docusaurus/plugin-content-docs": "2.0.0-beta.13", "@docusaurus/plugin-content-docs": "2.0.0-beta.14",
"@docusaurus/plugin-content-pages": "2.0.0-beta.13", "@docusaurus/plugin-content-pages": "2.0.0-beta.14",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
"parse-numeric-range": "^1.3.0", "parse-numeric-range": "^1.3.0",
@ -28,9 +28,9 @@
"utility-types": "^3.10.0" "utility-types": "^3.10.0"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@testing-library/react-hooks": "^7.0.2", "@testing-library/react-hooks": "^7.0.2",
"lodash": "^4.17.20" "lodash": "^4.17.20"
}, },

12
packages/docusaurus-theme-live-codeblock/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/theme-live-codeblock", "name": "@docusaurus/theme-live-codeblock",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus live code block component.", "description": "Docusaurus live code block component.",
"main": "lib/index.js", "main": "lib/index.js",
"publishConfig": { "publishConfig": {
@ -17,10 +17,10 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/theme-translations": "2.0.0-beta.13", "@docusaurus/theme-translations": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"@philpl/buble": "^0.19.7", "@philpl/buble": "^0.19.7",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"fs-extra": "^10.0.0", "fs-extra": "^10.0.0",
@ -30,7 +30,7 @@
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/buble": "^0.20.1" "@types/buble": "^0.20.1"
}, },
"peerDependencies": { "peerDependencies": {

16
packages/docusaurus-theme-search-algolia/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/theme-search-algolia", "name": "@docusaurus/theme-search-algolia",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Algolia search component for Docusaurus.", "description": "Algolia search component for Docusaurus.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "src/theme-search-algolia.d.ts", "types": "src/theme-search-algolia.d.ts",
@ -21,12 +21,12 @@
}, },
"dependencies": { "dependencies": {
"@docsearch/react": "^3.0.0-alpha.39", "@docsearch/react": "^3.0.0-alpha.39",
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/theme-common": "2.0.0-beta.13", "@docusaurus/theme-common": "2.0.0-beta.14",
"@docusaurus/theme-translations": "2.0.0-beta.13", "@docusaurus/theme-translations": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"algoliasearch": "^4.10.5", "algoliasearch": "^4.10.5",
"algoliasearch-helper": "^3.5.5", "algoliasearch-helper": "^3.5.5",
"clsx": "^1.1.1", "clsx": "^1.1.1",
@ -35,7 +35,7 @@
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"fs-extra": "^10.0.0" "fs-extra": "^10.0.0"
}, },
"peerDependencies": { "peerDependencies": {

6
packages/docusaurus-theme-translations/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/theme-translations", "name": "@docusaurus/theme-translations",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Docusaurus theme translations.", "description": "Docusaurus theme translations.",
"main": "lib/index.js", "main": "lib/index.js",
"types": "lib/index.d.ts", "types": "lib/index.d.ts",
@ -23,8 +23,8 @@
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"lodash": "^4.17.20" "lodash": "^4.17.20"
}, },
"engines": { "engines": {

2
packages/docusaurus-types/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/types", "name": "@docusaurus/types",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Common types for Docusaurus packages.", "description": "Common types for Docusaurus packages.",
"types": "./src/index.d.ts", "types": "./src/index.d.ts",
"publishConfig": { "publishConfig": {

4
packages/docusaurus-utils-common/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/utils-common", "name": "@docusaurus/utils-common",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Common (Node/Browser) utility functions for Docusaurus packages.", "description": "Common (Node/Browser) utility functions for Docusaurus packages.",
"main": "./lib/index.js", "main": "./lib/index.js",
"types": "./lib/index.d.ts", "types": "./lib/index.d.ts",
@ -21,7 +21,7 @@
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13" "@docusaurus/types": "2.0.0-beta.14"
}, },
"engines": { "engines": {
"node": ">=14" "node": ">=14"

6
packages/docusaurus-utils-validation/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/utils-validation", "name": "@docusaurus/utils-validation",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Node validation utility functions for Docusaurus packages.", "description": "Node validation utility functions for Docusaurus packages.",
"main": "./lib/index.js", "main": "./lib/index.js",
"types": "./lib/index.d.ts", "types": "./lib/index.d.ts",
@ -18,8 +18,8 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"joi": "^17.4.2", "joi": "^17.4.2",
"tslib": "^2.3.1" "tslib": "^2.3.1"
}, },

6
packages/docusaurus-utils/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/utils", "name": "@docusaurus/utils",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Node utility functions for Docusaurus packages.", "description": "Node utility functions for Docusaurus packages.",
"main": "./lib/index.js", "main": "./lib/index.js",
"types": "./lib/index.d.ts", "types": "./lib/index.d.ts",
@ -18,7 +18,7 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@mdx-js/runtime": "^1.6.22", "@mdx-js/runtime": "^1.6.22",
"@svgr/webpack": "^6.0.0", "@svgr/webpack": "^6.0.0",
"escape-string-regexp": "^4.0.0", "escape-string-regexp": "^4.0.0",
@ -39,7 +39,7 @@
"node": ">=14" "node": ">=14"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/dedent": "^0.7.0", "@types/dedent": "^0.7.0",
"@types/github-slugger": "^1.3.0", "@types/github-slugger": "^1.3.0",
"@types/micromatch": "^4.0.2", "@types/micromatch": "^4.0.2",

18
packages/docusaurus/package.json
View file

@ -1,7 +1,7 @@
{ {
"name": "@docusaurus/core", "name": "@docusaurus/core",
"description": "Easy to Maintain Open Source Documentation Websites", "description": "Easy to Maintain Open Source Documentation Websites",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"license": "MIT", "license": "MIT",
"publishConfig": { "publishConfig": {
"access": "public" "access": "public"
@ -41,13 +41,13 @@
"@babel/runtime": "^7.16.3", "@babel/runtime": "^7.16.3",
"@babel/runtime-corejs3": "^7.16.3", "@babel/runtime-corejs3": "^7.16.3",
"@babel/traverse": "^7.16.3", "@babel/traverse": "^7.16.3",
"@docusaurus/cssnano-preset": "2.0.0-beta.13", "@docusaurus/cssnano-preset": "2.0.0-beta.14",
"@docusaurus/logger": "2.0.0-beta.13", "@docusaurus/logger": "2.0.0-beta.14",
"@docusaurus/mdx-loader": "2.0.0-beta.13", "@docusaurus/mdx-loader": "2.0.0-beta.14",
"@docusaurus/react-loadable": "5.5.2", "@docusaurus/react-loadable": "5.5.2",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@docusaurus/utils-common": "2.0.0-beta.13", "@docusaurus/utils-common": "2.0.0-beta.14",
"@docusaurus/utils-validation": "2.0.0-beta.13", "@docusaurus/utils-validation": "2.0.0-beta.14",
"@slorber/static-site-generator-webpack-plugin": "^4.0.0", "@slorber/static-site-generator-webpack-plugin": "^4.0.0",
"@svgr/webpack": "^6.0.0", "@svgr/webpack": "^6.0.0",
"autoprefixer": "^10.3.5", "autoprefixer": "^10.3.5",
@ -108,8 +108,8 @@
"webpackbar": "^5.0.0-3" "webpackbar": "^5.0.0-3"
}, },
"devDependencies": { "devDependencies": {
"@docusaurus/module-type-aliases": "2.0.0-beta.13", "@docusaurus/module-type-aliases": "2.0.0-beta.14",
"@docusaurus/types": "2.0.0-beta.13", "@docusaurus/types": "2.0.0-beta.14",
"@types/copy-webpack-plugin": "^8.0.1", "@types/copy-webpack-plugin": "^8.0.1",
"@types/css-minimizer-webpack-plugin": "^3.0.2", "@types/css-minimizer-webpack-plugin": "^3.0.2",
"@types/detect-port": "^1.3.0", "@types/detect-port": "^1.3.0",

2
packages/lqip-loader/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@docusaurus/lqip-loader", "name": "@docusaurus/lqip-loader",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Low Quality Image Placeholders (LQIP) loader for webpack.", "description": "Low Quality Image Placeholders (LQIP) loader for webpack.",
"main": "lib/index.js", "main": "lib/index.js",
"publishConfig": { "publishConfig": {

2
packages/stylelint-copyright/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "stylelint-copyright", "name": "stylelint-copyright",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"description": "Stylelint plugin to check CSS files for a copyright header.", "description": "Stylelint plugin to check CSS files for a copyright header.",
"main": "index.js", "main": "index.js",
"license": "MIT", "license": "MIT",

18
website/package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "website", "name": "website",
"version": "2.0.0-beta.13", "version": "2.0.0-beta.14",
"private": true, "private": true,
"scripts": { "scripts": {
"docusaurus": "docusaurus", "docusaurus": "docusaurus",
@ -31,14 +31,14 @@
"dependencies": { "dependencies": {
"@crowdin/cli": "^3.7.1", "@crowdin/cli": "^3.7.1",
"@crowdin/crowdin-api-client": "^1.10.6", "@crowdin/crowdin-api-client": "^1.10.6",
"@docusaurus/core": "2.0.0-beta.13", "@docusaurus/core": "2.0.0-beta.14",
"@docusaurus/plugin-client-redirects": "2.0.0-beta.13", "@docusaurus/plugin-client-redirects": "2.0.0-beta.14",
"@docusaurus/plugin-ideal-image": "2.0.0-beta.13", "@docusaurus/plugin-ideal-image": "2.0.0-beta.14",
"@docusaurus/plugin-pwa": "2.0.0-beta.13", "@docusaurus/plugin-pwa": "2.0.0-beta.14",
"@docusaurus/preset-classic": "2.0.0-beta.13", "@docusaurus/preset-classic": "2.0.0-beta.14",
"@docusaurus/remark-plugin-npm2yarn": "2.0.0-beta.13", "@docusaurus/remark-plugin-npm2yarn": "2.0.0-beta.14",
"@docusaurus/theme-live-codeblock": "2.0.0-beta.13", "@docusaurus/theme-live-codeblock": "2.0.0-beta.14",
"@docusaurus/utils": "2.0.0-beta.13", "@docusaurus/utils": "2.0.0-beta.14",
"@popperjs/core": "^2.10.2", "@popperjs/core": "^2.10.2",
"clsx": "^1.1.1", "clsx": "^1.1.1",
"color": "^4.0.1", "color": "^4.0.1",

832
website/versioned_docs/version-2.0.0-beta.10/api/lifecycle-apis.md
View file

@ -1,832 +0,0 @@
---
sidebar_position: 1
id: lifecycle-apis
title: Lifecycle APIs
slug: /lifecycle-apis
toc_max_heading_level: 4
---
:::caution
This section is a work in progress.
:::
Lifecycle APIs are shared by Themes and Plugins.
## `validateOptions({options, validate})` {#validateoptionsoptions-validate}
Return validated and normalized options for the plugin. This method is called before the plugin is initialized.You must return options since the returned options will be passed to plugin during initialization.
### `options` {#options}
`validateOptions` is called with `options` passed to plugin for validation and normalization.
### `validate` {#validate}
`validateOptions` is called with `validate` function which takes a **[Joi](https://www.npmjs.com/package/joi)** schema and options as argument, returns validated and normalized options. `validate` will automatically handle error and validation config.
:::tip
[Joi](https://www.npmjs.com/package/joi) is recommended for validation and normalization of options.
To avoid mixing Joi versions, use `const {Joi} = require("@docusaurus/utils-validation")`
:::
If you don't use **[Joi](https://www.npmjs.com/package/joi)** for validation you can throw an Error in case of invalid options and return options in case of success.
```js {8-11} title="my-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
};
module.exports.validateOptions = ({options, validate}) => {
const validatedOptions = validate(myValidationSchema, options);
return validationOptions;
};
```
You can also use ES modules style exports.
```ts {8-11} title="my-plugin/src/index.ts"
export default function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
export function validateOptions({options, validate}) {
const validatedOptions = validate(myValidationSchema, options);
return validationOptions;
}
```
## `validateThemeConfig({themeConfig, validate})` {#validatethemeconfigthemeconfig-validate}
Return validated and normalized configuration for the theme.
### `themeConfig` {#themeconfig}
`validateThemeConfig` is called with `themeConfig` provided in `docusaurus.config.js` for validation and normalization.
### `validate` {#validate-1}
`validateThemeConfig` is called with `validate` function which takes a **[Joi](https://www.npmjs.com/package/joi)** schema and `themeConfig` as argument, returns validated and normalized options. `validate` will automatically handle error and validation config.
:::tip
[Joi](https://www.npmjs.com/package/joi) is recommended for validation and normalization of theme config.
To avoid mixing Joi versions, use `const {Joi} = require("@docusaurus/utils-validation")`
:::
If you don't use **[Joi](https://www.npmjs.com/package/joi)** for validation you can throw an Error in case of invalid options.
```js {8-11} title="my-theme/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
};
module.exports.validateThemeConfig = ({themeConfig, validate}) => {
const validatedThemeConfig = validate(myValidationSchema, options);
return validatedThemeConfig;
};
```
You can also use ES modules style exports.
```ts {8-11} title="my-theme/src/index.ts"
export default function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
export function validateThemeConfig({themeConfig, validate}) {
const validatedThemeConfig = validate(myValidationSchema, options);
return validatedThemeConfig;
}
```
## `getPathsToWatch()` {#getpathstowatch}
Specifies the paths to watch for plugins and themes. The paths are watched by the dev server so that the plugin lifecycles are reloaded when contents in the watched paths change. Note that the plugins and themes modules are initially called with `context` and `options` from Node, which you may use to find the necessary directory information about the site.
Example:
```js {5-7} title="docusaurus-plugin/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
getPathsToWatch() {
const contentPath = path.resolve(context.siteDir, options.path);
return [`${contentPath}/**/*.{ts,tsx}`];
},
};
};
```
## `async loadContent()` {#async-loadcontent}
Plugins should use this lifecycle to fetch from data sources (filesystem, remote API, headless CMS, etc) or doing some server processing.
For example, this plugin below return a random integer between 1 to 10 as content;
```js {5-6} title="docusaurus-plugin/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
async loadContent() {
return 1 + Math.floor(Math.random() * 10);
},
};
};
```
## `async contentLoaded({content, actions})` {#async-contentloadedcontent-actions}
Plugins should use the data loaded in `loadContent` and construct the pages/routes that consume the loaded data (optional).
### `content` {#content}
`contentLoaded` will be called _after_ `loadContent` is done, the return value of `loadContent()` will be passed to `contentLoaded` as `content`.
### `actions` {#actions}
`actions` contain three functions:
#### `addRoute(config: RouteConfig): void`
Create a route to add to the website.
```typescript
interface RouteConfig {
path: string;
component: string;
modules?: RouteModule;
routes?: RouteConfig[];
exact?: boolean;
priority?: number;
}
interface RouteModule {
[module: string]: Module | RouteModule | RouteModule[];
}
type Module =
| {
path: string;
__import?: boolean;
query?: ParsedUrlQueryInput;
}
| string;
```
#### `createData(name: string, data: any): Promise<string>`
A function to help you create static data (generally json or string), that you can provide to your routes as props.
For example, this plugin below create a `/friends` page which display `Your friends are: Yangshun, Sebastien`:
```jsx title="website/src/components/Friends.js"
import React from 'react';
export default function FriendsComponent({friends}) {
return <div>Your friends are {friends.join(',')}</div>;
}
```
```js {4-23} title="docusaurus-friends-plugin/src/index.js"
export default function friendsPlugin(context, options) {
return {
name: 'docusaurus-friends-plugin',
async contentLoaded({content, actions}) {
const {createData, addRoute} = actions;
// Create friends.json
const friends = ['Yangshun', 'Sebastien'];
const friendsJsonPath = await createData(
'friends.json',
JSON.stringify(friends),
);
// Add the '/friends' routes, and ensure it receives the friends props
addRoute({
path: '/friends',
component: '@site/src/components/Friends.js',
modules: {
// propName -> JSON file path
friends: friendsJsonPath,
},
exact: true,
});
},
};
}
```
#### `setGlobalData(data: any): void`
This function permits to create some global plugin data, that can be read from any page, including the pages created by other plugins, and your theme layout.
This data become accessible to your client-side/theme code, through the [`useGlobalData`](./docusaurus-core.md#useglobaldata) and [`usePluginData`](./docusaurus-core.md#useplugindatapluginname-string-pluginid-string).
One this data is created, you can access it with the global data hooks APIs.
:::caution
Global data is... global: its size affects the loading time of all pages of your site, so try to keep it small.
Prefer `createData` and page-specific data whenever possible.
:::
For example, this plugin below create a `/friends` page which display `Your friends are: Yangshun, Sebastien`:
```jsx title="website/src/components/Friends.js"
import React from 'react';
import {usePluginData} from '@docusaurus/useGlobalData';
export default function FriendsComponent() {
const {friends} = usePluginData('my-friends-plugin');
return <div>Your friends are {friends.join(',')}</div>;
}
```
```js {4-14} title="docusaurus-friends-plugin/src/index.js"
export default function friendsPlugin(context, options) {
return {
name: 'docusaurus-friends-plugin',
async contentLoaded({content, actions}) {
const {setGlobalData, addRoute} = actions;
// Create friends global data
setGlobalData({friends: ['Yangshun', 'Sebastien']});
// Add the '/friends' routes
addRoute({
path: '/friends',
component: '@site/src/components/Friends.js',
exact: true,
});
},
};
}
```
## `configureWebpack(config, isServer, utils, content)` {#configurewebpackconfig-isserver-utils}
Modifies the internal webpack config. If the return value is a JavaScript object, it will be merged into the final config using [`webpack-merge`](https://github.com/survivejs/webpack-merge). If it is a function, it will be called and receive `config` as the first argument and an `isServer` flag as the argument argument.
:::caution
The API of `configureWebpack` will be modified in the future to accept an object (`configureWebpack({config, isServer, utils, content})`)
:::
### `config` {#config}
`configureWebpack` is called with `config` generated according to client/server build. You may treat this as the base config to be merged with.
### `isServer` {#isserver}
`configureWebpack` will be called both in server build and in client build. The server build receives `true` and the client build receives `false` as `isServer`.
### `utils` {#utils}
`configureWebpack` also receives an util object:
- `getStyleLoaders(isServer: boolean, cssOptions: {[key: string]: any}): Loader[]`
- `getJSLoader(isServer: boolean, cacheOptions?: {}): Loader | null`
You may use them to return your webpack configures conditionally.
For example, this plugin below modify the webpack config to transpile `.foo` file.
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'custom-docusaurus-plugin',
// highlight-start
configureWebpack(config, isServer, utils) {
const {getCacheLoader} = utils;
return {
module: {
rules: [
{
test: /\.foo$/,
use: [getCacheLoader(isServer), 'my-custom-webpack-loader'],
},
],
},
};
},
// highlight-end
};
};
```
### `content` {#content}
`configureWebpack` will be called both with the content loaded by the plugin.
### Merge strategy {#merge-strategy}
We merge the Webpack configuration parts of plugins into the global Webpack config using [webpack-merge](https://github.com/survivejs/webpack-merge).
It is possible to specify the merge strategy. For example, if you want a webpack rule to be prepended instead of appended:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'custom-docusaurus-plugin',
configureWebpack(config, isServer, utils) {
return {
// highlight-start
mergeStrategy: {'module.rules': 'prepend'},
module: {rules: [myRuleToPrepend]},
// highlight-end
};
},
};
};
```
Read the [webpack-merge strategy doc](https://github.com/survivejs/webpack-merge#merging-with-strategies) for more details.
## `configurePostCss(options)` {#configurepostcssoptions}
Modifies [`postcssOptions` of `postcss-loader`](https://webpack.js.org/loaders/postcss-loader/#postcssoptions) during the generation of the client bundle.
Should return the mutated `postcssOptions`.
By default, `postcssOptions` looks like this:
```js
const postcssOptions = {
ident: 'postcss',
plugins: [require('autoprefixer')],
};
```
Example:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
// highlight-start
configurePostCss(postcssOptions) {
// Appends new PostCSS plugin.
postcssOptions.plugins.push(require('postcss-import'));
return postcssOptions;
},
// highlight-end
};
};
```
## `postBuild(props)` {#postbuildprops}
Called when a (production) build finishes.
```ts
interface Props {
siteDir: string;
generatedFilesDir: string;
siteConfig: DocusaurusConfig;
outDir: string;
baseUrl: string;
headTags: string;
preBodyTags: string;
postBodyTags: string;
routesPaths: string[];
plugins: Plugin<any>[];
}
```
Example:
```js {4-11} title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
async postBuild({siteConfig = {}, routesPaths = [], outDir}) {
// Print out to console all the rendered routes.
routesPaths.map((route) => {
console.log(route);
});
},
};
};
```
## `extendCli(cli)` {#extendclicli}
Register an extra command to enhance the CLI of Docusaurus. `cli` is [commander](https://www.npmjs.com/package/commander) object.
Example:
```js {4-11} title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
extendCli(cli) {
cli
.command('roll')
.description('Roll a random number between 1 and 1000')
.action(() => {
console.log(Math.floor(Math.random() * 1000 + 1));
});
},
};
};
```
## `injectHtmlTags({content})` {#injecthtmltags}
Inject head and/or body HTML tags to Docusaurus generated HTML.
`injectHtmlTags` will be called both with the content loaded by the plugin.
```typescript
function injectHtmlTags(): {
headTags?: HtmlTags;
preBodyTags?: HtmlTags;
postBodyTags?: HtmlTags;
};
type HtmlTags = string | HtmlTagObject | (string | HtmlTagObject)[];
interface HtmlTagObject {
/**
* Attributes of the HTML tag
* E.g. `{'disabled': true, 'value': 'demo', 'rel': 'preconnect'}`
*/
attributes?: {
[attributeName: string]: string | boolean;
};
/**
* The tag name e.g. `div`, `script`, `link`, `meta`
*/
tagName: string;
/**
* The inner HTML
*/
innerHTML?: string;
}
```
Example:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
loadContent: async () => {
return {remoteHeadTags: await fetchHeadTagsFromAPI()};
},
// highlight-start
injectHtmlTags({content}) {
return {
headTags: [
{
tagName: 'link',
attributes: {
rel: 'preconnect',
href: 'https://www.github.com',
},
},
...content.remoteHeadTags,
],
preBodyTags: [
{
tagName: 'script',
attributes: {
charset: 'utf-8',
src: '/noflash.js',
},
},
],
postBodyTags: [`<div> This is post body </div>`],
};
},
// highlight-end
};
};
```
## `getThemePath()` {#getthemepath}
Returns the path to the directory where the theme components can be found. When your users calls `swizzle`, `getThemePath` is called and its returned path is used to find your theme components.
If you use the folder directory above, your `getThemePath` can be:
```js {6-8} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'name-of-my-theme',
getThemePath() {
return path.resolve(__dirname, './theme');
},
};
};
```
## `getTypeScriptThemePath()` {#gettypescriptthemepath}
Similar to `getThemePath()`, it should return the path to the directory where the source code of TypeScript theme components can be found. Theme components under this path will **not** be resolved by Webpack. Therefore, it is not a replacement of `getThemePath()`. Instead, this path is purely for swizzling TypeScript theme components.
If you want to support TypeScript component swizzling for your theme, you can make the path returned by `getTypeScriptThemePath()` be your source directory, and make path returned by `getThemePath()` be the compiled JavaScript output.
Example:
```js {6-13} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'name-of-my-theme',
getThemePath() {
// Where compiled JavaScript output lives
return path.join(__dirname, '..', 'lib', 'theme');
},
getTypeScriptThemePath() {
// Where TypeScript source code lives
return path.resolve(__dirname, './theme');
},
};
};
```
## `getSwizzleComponentList()` {#getswizzlecomponentlist}
Return a list of stable component that are considered as safe for swizzling. These components will be listed in swizzle component without `--danger`. All the components are considers unstable by default. If an empty array is returned then all components are considered unstable, if `undefined` is returned then all component are considered stable.
```js {0-12} title="my-theme/src/index.js"
const swizzleAllowedComponents = [
'CodeBlock',
'DocSidebar',
'Footer',
'NotFound',
'SearchBar',
'hooks/useTheme',
'prism-include-languages',
];
module.exports.getSwizzleComponentList = () => swizzleAllowedComponents;
```
## `getClientModules()` {#getclientmodules}
Returns an array of paths to the modules that are to be imported in the client bundle. These modules are imported globally before React even renders the initial UI.
As an example, to make your theme load a `customCss` or `customJs` file path from `options` passed in by the user:
```js {7-9} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
const {customCss, customJs} = options || {};
return {
name: 'name-of-my-theme',
getClientModules() {
return [customCss, customJs];
},
};
};
```
<!--
For example, the in docusaurus-plugin-content-docs:
In loadContent, it loads the doc Markdown files based on the specified directory in options (defaulting to docs).
In contentLoaded, for each doc Markdown file, a route is created: /doc/installation, /doc/getting-started, etc.
-->
## i18n lifecycles {#i18n-lifecycles}
### `getTranslationFiles({content})` {#get-translation-files}
Plugins declare the JSON translation files they want to use.
Returns translation files `{path: string, content: ChromeI18nJSON}`:
- Path: relative to the plugin localized folder `i18n/<locale>/pluginName`. Extension `.json` is not necessary.
- Content: using the Chrome i18n JSON format
These files will be written by the [`write-translations` CLI](./cli.md#docusaurus-write-translations-sitedir) to the plugin i18n subfolder, and will be read in the appropriate locale before calling [`translateContent()`](#translate-content) and [`translateThemeConfig()`](#translate-theme-config)
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-plugin',
// highlight-start
async getTranslationFiles({content}) {
return [
{
path: 'sidebar-labels',
content: {
someSidebarLabel: {
message: 'Some Sidebar Label',
description: 'A label used in my plugin in the sidebar',
},
someLabelFromContent: content.myLabel,
},
},
];
},
// highlight-end
};
};
```
### `translateContent({content,translationFiles})` {#translate-content}
Translate the plugin content, using the localized translation files.
Returns the localized plugin content.
The `contentLoaded()` lifecycle will be called with the localized plugin content returned by `translateContent()`.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-plugin',
// highlight-start
translateContent({content, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...content,
someContentLabel: myTranslationFile.someContentLabel.message,
};
},
// highlight-end
};
};
```
### `translateThemeConfig({themeConfig,translationFiles})` {#translate-theme-config}
Translate the site `themeConfig` labels, using the localized translation files.
Returns the localized `themeConfig`.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-theme',
// highlight-start
translateThemeConfig({themeConfig, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...themeConfig,
someThemeConfigLabel: myTranslationFile.someThemeConfigLabel.message,
};
},
// highlight-end
};
};
```
### `async getDefaultCodeTranslationMessages()` {#get-default-code-translation-messages}
Themes using the `<Translate>` API can provide default code translation messages.
It should return messages in `Record<string,string`>, where keys are translation ids and values are messages (without the description) localized using the site current locale.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-theme',
// highlight-start
async getDefaultCodeTranslationMessages() {
return readJsonFile(`${context.i18n.currentLocale}.json`);
},
// highlight-end
};
};
```
## Example {#example}
Here's a mind model for a presumptuous plugin implementation.
```jsx
const DEFAULT_OPTIONS = {
// Some defaults.
};
// A JavaScript function that returns an object.
// `context` is provided by Docusaurus. Example: siteConfig can be accessed from context.
// `opts` is the user-defined options.
module.exports = function (context, opts) {
// Merge defaults with user-defined options.
const options = {...DEFAULT_OPTIONS, ...options};
return {
// A compulsory field used as the namespace for directories to cache
// the intermediate data for each plugin.
// If you're writing your own local plugin, you will want it to
// be unique in order not to potentially conflict with imported plugins.
// A good way will be to add your own project name within.
name: 'docusaurus-my-project-cool-plugin',
async loadContent() {
// The loadContent hook is executed after siteConfig and env has been loaded.
// You can return a JavaScript object that will be passed to contentLoaded hook.
},
async contentLoaded({content, actions}) {
// The contentLoaded hook is done after loadContent hook is done.
// `actions` are set of functional API provided by Docusaurus (e.g. addRoute)
},
async postBuild(props) {
// After docusaurus <build> finish.
},
// TODO
async postStart(props) {
// docusaurus <start> finish
},
// TODO
afterDevServer(app, server) {
// https://webpack.js.org/configuration/dev-server/#devserverbefore
},
// TODO
beforeDevServer(app, server) {
// https://webpack.js.org/configuration/dev-server/#devserverafter
},
configureWebpack(config, isServer, utils, content) {
// Modify internal webpack config. If returned value is an Object, it
// will be merged into the final config using webpack-merge;
// If the returned value is a function, it will receive the config as the 1st argument and an isServer flag as the 2nd argument.
},
getPathsToWatch() {
// Paths to watch.
},
getThemePath() {
// Returns the path to the directory where the theme components can
// be found.
},
getClientModules() {
// Return an array of paths to the modules that are to be imported
// in the client bundle. These modules are imported globally before
// React even renders the initial UI.
},
extendCli(cli) {
// Register an extra command to enhance the CLI of Docusaurus
},
injectHtmlTags({content}) {
// Inject head and/or body HTML tags.
},
async getTranslationFiles({content}) {
// Return translation files
},
translateContent({content, translationFiles}) {
// translate the plugin content here
},
translateThemeConfig({themeConfig, translationFiles}) {
// translate the site themeConfig here
},
async getDefaultCodeTranslationMessages() {
// return default theme translations here
},
};
};
```

86
website/versioned_docs/version-2.0.0-beta.10/guides/docs/docs-introduction.md
View file

@ -1,86 +0,0 @@
---
id: introduction
title: Docs Introduction
sidebar_label: Introduction
slug: /docs-introduction
---
The docs feature provides users with a way to organize Markdown files in a hierarchical format.
:::info
Check the [Docs Plugin API Reference documentation](./../../api/plugins/plugin-content-docs.md) for an exhaustive list of options.
:::
## Document ID {#document-id}
Every document has a unique `id`. By default, a document `id` is the name of the document (without the extension) relative to the root docs directory.
For example, `greeting.md` id is `greeting` and `guide/hello.md` id is `guide/hello`.
```bash
website # Root directory of your site
└── docs
   ├── greeting.md
└── guide
└── hello.md
```
However, the **last part** of the `id` can be defined by user in the front matter. For example, if `guide/hello.md`'s content is defined as below, its final `id` is `guide/part1`.
```yml
---
id: part1
---
Lorem ipsum
```
If you want more control over the last part of the document URL, it is possible to add a `slug` (defaults to the `id`).
```yml
---
id: part1
slug: part1.html
---
Lorem ipsum
```
:::note
It is possible to use:
- absolute slugs: `slug: /mySlug`, `slug: /`...
- relative slugs: `slug: mySlug`, `slug: ./../mySlug`...
:::
## Home page docs {#home-page-docs}
If you want a document to be available at the root, and have a path like `https://docusaurus.io/docs/`, you can use the slug frontmatter:
```yml
---
id: my-home-doc
slug: /
---
Lorem ipsum
```
## Docs-only mode {#docs-only-mode}
If you only want the documentation feature, you can run your Docusaurus 2 site without a landing page and display your documentation page as the index page instead.
To enable docs-only mode, set the docs plugin `routeBasePath: '/'`, and use the frontmatter `slug: /` on the document that should be the index page ([more info](#home-page-docs)).
:::caution
You should delete the existing homepage at `./src/pages/index.js`, or else there will be two files mapping to the same route!
:::
:::tip
There's also a "blog-only mode" for those who only want to use the blog feature of Docusaurus 2. You can use the same method detailed above. Follow the setup instructions on [Blog-only mode](../../blog.mdx#blog-only-mode).
:::

0
website/versioned_docs/version-2.0.0-beta.10/_partials/swizzleWarning.mdx → website/versioned_docs/version-2.0.0-beta.14/_partials/swizzleWarning.mdx
View file

2
website/versioned_docs/version-2.0.0-beta.10/api/docusaurus.config.js.md → website/versioned_docs/version-2.0.0-beta.14/api/docusaurus.config.js.md
View file

@ -414,7 +414,7 @@ module.exports = {
}; };
``` ```
See also: [`getClientModules()`](lifecycle-apis.md#getclientmodules). See also: [`getClientModules()`](./plugin-methods/lifecycle-apis.md#getClientModules).
### `ssrTemplate` {#ssrtemplate} ### `ssrTemplate` {#ssrtemplate}

146
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/README.md Normal file
View file

@ -0,0 +1,146 @@
# Plugin Method References
:::caution
This section is a work in progress. Anchor links or even URLs are not guaranteed to be stable.
:::
Plugin APIs are shared by themes and plugins—themes are loaded just like plugins.
## Plugin module
Every plugin is imported as a module. The module is expected to have the following members:
- A **default export**: the constructor function for the plugin.
- **Named exports**: the [static methods](./static-methods.md) called before plugins are initialized.
## Plugin constructor
The plugin module's default export is a constructor function with the signature `(context: LoadContext, options: PluginOptions) => Plugin`.
### `context` {#context}
`context` is plugin-agnostic, and the same object will be passed into all plugins used for a Docusaurus website. The `context` object contains the following fields:
```ts
interface LoadContext {
siteDir: string;
generatedFilesDir: string;
siteConfig: DocusaurusConfig;
outDir: string;
baseUrl: string;
}
```
### `options` {#options}
`options` are the [second optional parameter when the plugins are used](../../using-plugins.md#configuring-plugins). `options` are plugin-specific and are specified by users when they use them in `docusaurus.config.js`. If there's a [`validateOptions`](./static-methods.md#validateOptions) function exported, the `options` will be validated and normalized beforehand.
Alternatively, if preset contains the plugin, the preset will then be in charge of passing the correct options into the plugin. It is up to individual plugin to define what options it takes.
## Example {#example}
Here's a mind model for a presumptuous plugin implementation.
```js
// A JavaScript function that returns an object.
// `context` is provided by Docusaurus. Example: siteConfig can be accessed from context.
// `opts` is the user-defined options.
function myPlugin(context, opts) {
return {
// A compulsory field used as the namespace for directories to cache
// the intermediate data for each plugin.
// If you're writing your own local plugin, you will want it to
// be unique in order not to potentially conflict with imported plugins.
// A good way will be to add your own project name within.
name: 'docusaurus-my-project-cool-plugin',
async loadContent() {
// The loadContent hook is executed after siteConfig and env has been loaded.
// You can return a JavaScript object that will be passed to contentLoaded hook.
},
async contentLoaded({content, actions}) {
// The contentLoaded hook is done after loadContent hook is done.
// `actions` are set of functional API provided by Docusaurus (e.g. addRoute)
},
async postBuild(props) {
// After docusaurus <build> finish.
},
// TODO
async postStart(props) {
// docusaurus <start> finish
},
// TODO
afterDevServer(app, server) {
// https://webpack.js.org/configuration/dev-server/#devserverbefore
},
// TODO
beforeDevServer(app, server) {
// https://webpack.js.org/configuration/dev-server/#devserverafter
},
configureWebpack(config, isServer, utils, content) {
// Modify internal webpack config. If returned value is an Object, it
// will be merged into the final config using webpack-merge;
// If the returned value is a function, it will receive the config as the 1st argument and an isServer flag as the 2nd argument.
},
getPathsToWatch() {
// Paths to watch.
},
getThemePath() {
// Returns the path to the directory where the theme components can
// be found.
},
getClientModules() {
// Return an array of paths to the modules that are to be imported
// in the client bundle. These modules are imported globally before
// React even renders the initial UI.
},
extendCli(cli) {
// Register an extra command to enhance the CLI of Docusaurus
},
injectHtmlTags({content}) {
// Inject head and/or body HTML tags.
},
async getTranslationFiles({content}) {
// Return translation files
},
translateContent({content, translationFiles}) {
// translate the plugin content here
},
translateThemeConfig({themeConfig, translationFiles}) {
// translate the site themeConfig here
},
async getDefaultCodeTranslationMessages() {
// return default theme translations here
},
};
}
myPlugin.validateOptions = ({options, validate}) => {
const validatedOptions = validate(myValidationSchema, options);
return validationOptions;
};
myPlugin.validateThemeConfig = ({themeConfig, validate}) => {
const validatedThemeConfig = validate(myValidationSchema, options);
return validatedThemeConfig;
};
module.exports = myPlugin;
```

2
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/_category_.yml Normal file
View file

@ -0,0 +1,2 @@
label: Plugin method references
position: 1

125
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/extend-infrastructure.md Normal file
View file

@ -0,0 +1,125 @@
---
sidebar_position: 2
---
# Extending infrastructure
Docusaurus has some infrastructure like hot reloading, CLI, and swizzling, that can be extended by external plugins.
## `getPathsToWatch()` {#getPathsToWatch}
Specifies the paths to watch for plugins and themes. The paths are watched by the dev server so that the plugin lifecycles are reloaded when contents in the watched paths change. Note that the plugins and themes modules are initially called with `context` and `options` from Node, which you may use to find the necessary directory information about the site. Use this for files that are consumed server-side, because theme files are automatically watched by Webpack dev server.
Example:
```js {5-7} title="docusaurus-plugin/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
getPathsToWatch() {
const contentPath = path.resolve(context.siteDir, options.path);
return [`${contentPath}/**/*.{ts,tsx}`];
},
};
};
```
## `extendCli(cli)` {#extendCli}
Register an extra command to enhance the CLI of Docusaurus. `cli` is [commander](https://www.npmjs.com/package/commander/v/5.1.0) object.
:::caution
The commander version matters! We use commander v5, and make sure you are referring to the right version documentation for available APIs.
:::
Example:
```js {4-11} title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
extendCli(cli) {
cli
.command('roll')
.description('Roll a random number between 1 and 1000')
.action(() => {
console.log(Math.floor(Math.random() * 1000 + 1));
});
},
};
};
```
## `getThemePath()` {#getThemePath}
Returns the path to the directory where the theme components can be found. When your users calls `swizzle`, `getThemePath` is called and its returned path is used to find your theme components.
For example, your `getThemePath` can be:
```js {6-8} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'my-theme',
getThemePath() {
return path.resolve(__dirname, './theme');
},
};
};
```
## `getTypeScriptThemePath()` {#getTypeScriptThemePath}
Similar to `getThemePath()`, it should return the path to the directory where the source code of TypeScript theme components can be found. This path is purely for swizzling TypeScript theme components, and theme components under this path will **not** be resolved by Webpack. Therefore, it is not a replacement of `getThemePath()`. Typically, you can make the path returned by `getTypeScriptThemePath()` be your source directory, and make path returned by `getThemePath()` be the compiled JavaScript output.
:::tip
For TypeScript theme authors: you are strongly advised to make your compiled output as human-readable as possible. Only strip type annotations and don't transpile any syntaxes, because they will be handled by Webpack's Babel loader based on the targeted browser versions.
You should also format these files with Prettier. Remember—JS files can and will be directly consumed by your users.
:::
Example:
```js {6-13} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
return {
name: 'my-theme',
getThemePath() {
// Where compiled JavaScript output lives
return path.join(__dirname, '../lib/theme');
},
getTypeScriptThemePath() {
// Where TypeScript source code lives
return path.resolve(__dirname, '../src/theme');
},
};
};
```
## `getSwizzleComponentList()` {#getSwizzleComponentList}
**This is a static method, not attached to any plugin instance.**
Returns a list of stable component that are considered as safe for swizzling. These components will be listed in swizzle component without `--danger`. All the components are considers unstable by default. If an empty array is returned, all components are considered unstable. If `undefined` is returned, all component are considered stable.
```js {0-12} title="my-theme/src/index.js"
const swizzleAllowedComponents = [
'CodeBlock',
'DocSidebar',
'Footer',
'NotFound',
'SearchBar',
'hooks/useTheme',
'prism-include-languages',
];
myTheme.getSwizzleComponentList = () => swizzleAllowedComponents;
```

121
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/i18n-lifecycles.md Normal file
View file

@ -0,0 +1,121 @@
---
sidebar_position: 3
---
# I18n lifecycles
Plugins use these lifecycles to load i18n-related data.
## `getTranslationFiles({content})` {#getTranslationFiles}
Plugins declare the JSON translation files they want to use.
Returns translation files `{path: string, content: ChromeI18nJSON}`:
- `path`: relative to the plugin localized folder `i18n/[locale]/[pluginName]`. Extension `.json` should be omitted to remain generic.
- `content`: using the Chrome i18n JSON format.
These files will be written by the [`write-translations` CLI](../../cli.md#docusaurus-write-translations-sitedir) to the plugin i18n subfolder, and will be read in the appropriate locale before calling [`translateContent()`](#translateContent) and [`translateThemeConfig()`](#translateThemeConfig)
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-plugin',
// highlight-start
async getTranslationFiles({content}) {
return [
{
path: 'sidebar-labels',
content: {
someSidebarLabel: {
message: 'Some Sidebar Label',
description: 'A label used in my plugin in the sidebar',
},
someLabelFromContent: content.myLabel,
},
},
];
},
// highlight-end
};
};
```
## `translateContent({content,translationFiles})` {#translateContent}
Translate the plugin content, using the localized translation files.
Returns the localized plugin content.
The `contentLoaded()` lifecycle will be called with the localized plugin content returned by `translateContent()`.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-plugin',
// highlight-start
translateContent({content, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...content,
someContentLabel: myTranslationFile.someContentLabel.message,
};
},
// highlight-end
};
};
```
## `translateThemeConfig({themeConfig,translationFiles})` {#translateThemeConfig}
Translate the site `themeConfig` labels, using the localized translation files.
Returns the localized `themeConfig`.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-theme',
// highlight-start
translateThemeConfig({themeConfig, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...themeConfig,
someThemeConfigLabel: myTranslationFile.someThemeConfigLabel.message,
};
},
// highlight-end
};
};
```
## `async getDefaultCodeTranslationMessages()` {#getDefaultCodeTranslationMessages}
Themes using the `<Translate>` API can provide default code translation messages.
It should return messages in `Record<string, string>`, where keys are translation ids and values are messages (without the description) localized using the site current locale.
Example:
```js
module.exports = function (context, options) {
return {
name: 'my-theme',
// highlight-start
async getDefaultCodeTranslationMessages() {
return readJsonFile(`${context.i18n.currentLocale}.json`);
},
// highlight-end
};
};
```

388
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/lifecycle-apis.md Normal file
View file

@ -0,0 +1,388 @@
---
sidebar_position: 1
toc_max_heading_level: 4
---
# Lifecycle APIs
During build, plugins are loaded in parallel to fetch their own contents and render them to routes. Plugins may also configure webpack or post-process the generated files.
## `async loadContent()` {#loadContent}
Plugins should use this lifecycle to fetch from data sources (filesystem, remote API, headless CMS, etc.) or do some server processing. The return value is the content it needs.
For example, this plugin below return a random integer between 1 to 10 as content.
```js {5-6} title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
async loadContent() {
return 1 + Math.floor(Math.random() * 10);
},
};
};
```
## `async contentLoaded({content, actions})` {#contentLoaded}
The data that was loaded in `loadContent` will be consumed in `contentLoaded`. It can be rendered to routes, registered as global data, etc.
### `content` {#content}
`contentLoaded` will be called _after_ `loadContent` is done. The return value of `loadContent()` will be passed to `contentLoaded` as `content`.
### `actions` {#actions}
`actions` contain three functions:
#### `addRoute(config: RouteConfig): void` {#addRoute}
Create a route to add to the website.
```ts
interface RouteConfig {
path: string;
component: string;
modules?: RouteModule;
routes?: RouteConfig[];
exact?: boolean;
priority?: number;
}
interface RouteModule {
[module: string]: Module | RouteModule | RouteModule[];
}
type Module =
| {
path: string;
__import?: boolean;
query?: ParsedUrlQueryInput;
}
| string;
```
#### `createData(name: string, data: any): Promise<string>` {#createData}
A declarative callback to create static data (generally json or string) which can later be provided to your routes as props. Takes the file name and data to be stored, and returns the actual data file's path.
For example, this plugin below create a `/friends` page which display `Your friends are: Yangshun, Sebastien`:
```jsx title="website/src/components/Friends.js"
import React from 'react';
export default function FriendsComponent({friends}) {
return <div>Your friends are {friends.join(',')}</div>;
}
```
```js {4-23} title="docusaurus-friends-plugin/src/index.js"
export default function friendsPlugin(context, options) {
return {
name: 'docusaurus-friends-plugin',
async contentLoaded({content, actions}) {
const {createData, addRoute} = actions;
// Create friends.json
const friends = ['Yangshun', 'Sebastien'];
const friendsJsonPath = await createData(
'friends.json',
JSON.stringify(friends),
);
// Add the '/friends' routes, and ensure it receives the friends props
addRoute({
path: '/friends',
component: '@site/src/components/Friends.js',
modules: {
// propName -> JSON file path
friends: friendsJsonPath,
},
exact: true,
});
},
};
}
```
#### `setGlobalData(data: any): void`
This function permits to create some global plugin data that can be read from any page, including the pages created by other plugins, and your theme layout.
This data becomes accessible to your client-side/theme code through the [`useGlobalData`](../../docusaurus-core.md#useGlobalData) and [`usePluginData`](../../docusaurus-core.md#usePluginData) hooks.
:::caution
Global data is... global: its size affects the loading time of all pages of your site, so try to keep it small. Prefer `createData` and page-specific data whenever possible.
:::
For example, this plugin below create a `/friends` page which display `Your friends are: Yangshun, Sebastien`:
```jsx title="website/src/components/Friends.js"
import React from 'react';
import {usePluginData} from '@docusaurus/useGlobalData';
export default function FriendsComponent() {
const {friends} = usePluginData('my-friends-plugin');
return <div>Your friends are {friends.join(',')}</div>;
}
```
```js {4-14} title="docusaurus-friends-plugin/src/index.js"
export default function friendsPlugin(context, options) {
return {
name: 'docusaurus-friends-plugin',
async contentLoaded({content, actions}) {
const {setGlobalData, addRoute} = actions;
// Create friends global data
setGlobalData({friends: ['Yangshun', 'Sebastien']});
// Add the '/friends' routes
addRoute({
path: '/friends',
component: '@site/src/components/Friends.js',
exact: true,
});
},
};
}
```
## `configureWebpack(config, isServer, utils, content)` {#configureWebpack}
Modifies the internal webpack config. If the return value is a JavaScript object, it will be merged into the final config using [`webpack-merge`](https://github.com/survivejs/webpack-merge). If it is a function, it will be called and receive `config` as the first argument and an `isServer` flag as the second argument.
:::caution
The API of `configureWebpack` will be modified in the future to accept an object (`configureWebpack({config, isServer, utils, content})`)
:::
### `config` {#config}
`configureWebpack` is called with `config` generated according to client/server build. You may treat this as the base config to be merged with.
### `isServer` {#isServer}
`configureWebpack` will be called both in server build and in client build. The server build receives `true` and the client build receives `false` as `isServer`.
### `utils` {#utils}
`configureWebpack` also receives an util object:
- `getStyleLoaders(isServer: boolean, cssOptions: {[key: string]: any}): Loader[]`
- `getJSLoader(isServer: boolean, cacheOptions?: {}): Loader | null`
You may use them to return your webpack configures conditionally.
For example, this plugin below modify the webpack config to transpile `.foo` file.
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'custom-docusaurus-plugin',
// highlight-start
configureWebpack(config, isServer, utils) {
const {getCacheLoader} = utils;
return {
module: {
rules: [
{
test: /\.foo$/,
use: [getCacheLoader(isServer), 'my-custom-webpack-loader'],
},
],
},
};
},
// highlight-end
};
};
```
### `content` {#content}
`configureWebpack` will be called both with the content loaded by the plugin.
### Merge strategy {#merge-strategy}
We merge the Webpack configuration parts of plugins into the global Webpack config using [webpack-merge](https://github.com/survivejs/webpack-merge).
It is possible to specify the merge strategy. For example, if you want a webpack rule to be prepended instead of appended:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'custom-docusaurus-plugin',
configureWebpack(config, isServer, utils) {
return {
// highlight-start
mergeStrategy: {'module.rules': 'prepend'},
module: {rules: [myRuleToPrepend]},
// highlight-end
};
},
};
};
```
Read the [webpack-merge strategy doc](https://github.com/survivejs/webpack-merge#merging-with-strategies) for more details.
## `configurePostCss(options)` {#configurePostCss}
Modifies [`postcssOptions` of `postcss-loader`](https://webpack.js.org/loaders/postcss-loader/#postcssoptions) during the generation of the client bundle.
Should return the mutated `postcssOptions`.
By default, `postcssOptions` looks like this:
```js
const postcssOptions = {
ident: 'postcss',
plugins: [require('autoprefixer')],
};
```
Example:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
// highlight-start
configurePostCss(postcssOptions) {
// Appends new PostCSS plugin.
postcssOptions.plugins.push(require('postcss-import'));
return postcssOptions;
},
// highlight-end
};
};
```
## `postBuild(props)` {#postBuild}
Called when a (production) build finishes.
```ts
interface Props {
siteDir: string;
generatedFilesDir: string;
siteConfig: DocusaurusConfig;
outDir: string;
baseUrl: string;
headTags: string;
preBodyTags: string;
postBodyTags: string;
routesPaths: string[];
plugins: Plugin<any>[];
}
```
Example:
```js {4-11} title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
async postBuild({siteConfig = {}, routesPaths = [], outDir}) {
// Print out to console all the rendered routes.
routesPaths.map((route) => {
console.log(route);
});
},
};
};
```
## `injectHtmlTags({content})` {#injectHtmlTags}
Inject head and/or body HTML tags to Docusaurus generated HTML.
`injectHtmlTags` will be called both with the content loaded by the plugin.
```typescript
function injectHtmlTags(): {
headTags?: HtmlTags;
preBodyTags?: HtmlTags;
postBodyTags?: HtmlTags;
};
type HtmlTags = string | HtmlTagObject | (string | HtmlTagObject)[];
interface HtmlTagObject {
/**
* Attributes of the HTML tag
* E.g. `{'disabled': true, 'value': 'demo', 'rel': 'preconnect'}`
*/
attributes?: {
[attributeName: string]: string | boolean;
};
/**
* The tag name e.g. `div`, `script`, `link`, `meta`
*/
tagName: string;
/**
* The inner HTML
*/
innerHTML?: string;
}
```
Example:
```js title="docusaurus-plugin/src/index.js"
module.exports = function (context, options) {
return {
name: 'docusaurus-plugin',
loadContent: async () => {
return {remoteHeadTags: await fetchHeadTagsFromAPI()};
},
// highlight-start
injectHtmlTags({content}) {
return {
headTags: [
{
tagName: 'link',
attributes: {
rel: 'preconnect',
href: 'https://www.github.com',
},
},
...content.remoteHeadTags,
],
preBodyTags: [
{
tagName: 'script',
attributes: {
charset: 'utf-8',
src: '/noflash.js',
},
},
],
postBodyTags: [`<div> This is post body </div>`],
};
},
// highlight-end
};
};
```
## `getClientModules()` {#getClientModules}
Returns an array of paths to the modules that are to be imported in the client bundle. These modules are imported globally before React even renders the initial UI.
As an example, to make your theme load a `customCss` or `customJs` file path from `options` passed in by the user:
```js {7-9} title="my-theme/src/index.js"
const path = require('path');
module.exports = function (context, options) {
const {customCss, customJs} = options || {};
return {
name: 'name-of-my-theme',
getClientModules() {
return [customCss, customJs];
},
};
};
```

115
website/versioned_docs/version-2.0.0-beta.14/api/plugin-methods/static-methods.md Normal file
View file

@ -0,0 +1,115 @@
---
sidebar_position: 4
---
# Static methods
Static methods are not part of the plugin instance—they are attached to the constructor function. These methods are used to validate and normalize the plugin options and theme config, which are then used as constructor parameters to initialize the plugin instance.
## `validateOptions({options, validate})` {#validateOptions}
Return validated and normalized options for the plugin. This method is called before the plugin is initialized.You must return options since the returned options will be passed to plugin during initialization.
### `options` {#options}
`validateOptions` is called with `options` passed to plugin for validation and normalization.
### `validate` {#validate}
`validateOptions` is called with `validate` function which takes a **[Joi](https://www.npmjs.com/package/joi)** schema and options as argument, returns validated and normalized options. `validate` will automatically handle error and validation config.
:::tip
[Joi](https://www.npmjs.com/package/joi) is recommended for validation and normalization of options.
To avoid mixing Joi versions, use `const {Joi} = require("@docusaurus/utils-validation")`
:::
If you don't use **[Joi](https://www.npmjs.com/package/joi)** for validation you can throw an Error in case of invalid options and return options in case of success.
```js {8-11} title="my-plugin/src/index.js"
function myPlugin(context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
myPlugin.validateOptions = ({options, validate}) => {
const validatedOptions = validate(myValidationSchema, options);
return validationOptions;
};
module.exports = myPlugin;
```
In TypeScript, you can also choose to export this as a separate named export.
```ts {8-11} title="my-plugin/src/index.ts"
export default function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
export function validateOptions({options, validate}) {
const validatedOptions = validate(myValidationSchema, options);
return validationOptions;
}
```
## `validateThemeConfig({themeConfig, validate})` {#validateThemeConfig}
Return validated and normalized configuration for the theme.
### `themeConfig` {#themeConfig}
`validateThemeConfig` is called with `themeConfig` provided in `docusaurus.config.js` for validation and normalization.
### `validate` {#validate-1}
`validateThemeConfig` is called with `validate` function which takes a **[Joi](https://www.npmjs.com/package/joi)** schema and `themeConfig` as argument, returns validated and normalized options. `validate` will automatically handle error and validation config.
:::tip
[Joi](https://www.npmjs.com/package/joi) is recommended for validation and normalization of theme config.
To avoid mixing Joi versions, use `const {Joi} = require("@docusaurus/utils-validation")`
:::
If you don't use **[Joi](https://www.npmjs.com/package/joi)** for validation you can throw an Error in case of invalid options.
```js {8-11} title="my-theme/src/index.js"
function myPlugin(context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
myPlugin.validateThemeConfig = ({themeConfig, validate}) => {
const validatedThemeConfig = validate(myValidationSchema, options);
return validatedThemeConfig;
};
module.exports = validateThemeConfig;
```
In TypeScript, you can also choose to export this as a separate named export.
```ts {8-11} title="my-theme/src/index.ts"
export default function (context, options) {
return {
name: 'docusaurus-plugin',
// rest of methods
};
}
export function validateThemeConfig({themeConfig, validate}) {
const validatedThemeConfig = validate(myValidationSchema, options);
return validatedThemeConfig;
}
```

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/_category_.yml → website/versioned_docs/version-2.0.0-beta.14/api/plugins/_category_.yml
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/overview.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/overview.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-client-redirects.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-client-redirects.md
View file

14
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-content-blog.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-content-blog.md
View file

@ -56,8 +56,8 @@ Accepted fields:
| `showReadingTime` | `boolean` | `true` | Show estimated reading time for the blog post. | | `showReadingTime` | `boolean` | `true` | Show estimated reading time for the blog post. |
| `readingTime` | `ReadingTimeFunctionOption` | The default reading time | A callback to customize the reading time number displayed. | | `readingTime` | `ReadingTimeFunctionOption` | The default reading time | A callback to customize the reading time number displayed. |
| `authorsMapPath` | `string` | `'authors.yml'` | Path to the authors map file, relative to the blog content directory specified with `path`. Can also be a `json` file. | | `authorsMapPath` | `string` | `'authors.yml'` | Path to the authors map file, relative to the blog content directory specified with `path`. Can also be a `json` file. |
| `feedOptions` | _See below_ | `{type: ['rss', 'atom']}` | Blog feed. If undefined, no rss feed will be generated. | | `feedOptions` | _See below_ | `{type: ['rss', 'atom']}` | Blog feed. |
| `feedOptions.type` | <code>'rss' \| 'atom' \| 'all'</code> (or array of multiple options) | **Required** | Type of feed to be generated. | | `feedOptions.type` | <code>FeedType \| FeedType[] \| 'all' \| null</code> | **Required** | Type of feed to be generated. Use `null` to disable generation. |
| `feedOptions.title` | `string` | `siteConfig.title` | Title of the feed. | | `feedOptions.title` | `string` | `siteConfig.title` | Title of the feed. |
| `feedOptions.description` | `string` | <code>\`${siteConfig.title} Blog\`</code> | Description of the feed. | | `feedOptions.description` | `string` | <code>\`${siteConfig.title} Blog\`</code> | Description of the feed. |
| `feedOptions.copyright` | `string` | `undefined` | Copyright message. | | `feedOptions.copyright` | `string` | `undefined` | Copyright message. |
@ -90,6 +90,8 @@ type ReadingTimeFunctionOption = (params: {
frontMatter: BlogPostFrontMatter & Record<string, unknown>; frontMatter: BlogPostFrontMatter & Record<string, unknown>;
defaultReadingTime: ReadingTimeFunction; defaultReadingTime: ReadingTimeFunction;
}) => number | undefined; }) => number | undefined;
type FeedType = 'rss' | 'atom' | 'json';
``` ```
## Example configuration {#ex-config} ## Example configuration {#ex-config}
@ -262,15 +264,15 @@ Read the [i18n introduction](../../i18n/i18n-introduction.md) first.
### Translation files location {#translation-files-location} ### Translation files location {#translation-files-location}
- **Base path**: `website/i18n/<locale>/docusaurus-plugin-content-blog` - **Base path**: `website/i18n/[locale]/docusaurus-plugin-content-blog`
- **Multi-instance path**: `website/i18n/<locale>/docusaurus-plugin-content-blog-<pluginId>` - **Multi-instance path**: `website/i18n/[locale]/docusaurus-plugin-content-blog-[pluginId]`
- **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir) - **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir)
- **Markdown files**: `website/i18n/<locale>/docusaurus-plugin-content-blog` - **Markdown files**: `website/i18n/[locale]/docusaurus-plugin-content-blog`
### Example file-system structure {#example-file-system-structure} ### Example file-system structure {#example-file-system-structure}
```bash ```bash
website/i18n/<locale>/docusaurus-plugin-content-blog website/i18n/[locale]/docusaurus-plugin-content-blog
│ │
│ # translations for website/blog │ # translations for website/blog
├── authors.yml ├── authors.yml

8
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-content-docs.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-content-docs.md
View file

@ -302,15 +302,15 @@ Read the [i18n introduction](../../i18n/i18n-introduction.md) first.
### Translation files location {#translation-files-location} ### Translation files location {#translation-files-location}
- **Base path**: `website/i18n/<locale>/docusaurus-plugin-content-docs` - **Base path**: `website/i18n/[locale]/docusaurus-plugin-content-docs`
- **Multi-instance path**: `website/i18n/<locale>/docusaurus-plugin-content-docs-<pluginId>` - **Multi-instance path**: `website/i18n/[locale]/docusaurus-plugin-content-docs-[pluginId]`
- **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir) - **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir)
- **Markdown files**: `website/i18n/<locale>/docusaurus-plugin-content-docs/<version>` - **Markdown files**: `website/i18n/[locale]/docusaurus-plugin-content-docs/[versionName]`
### Example file-system structure {#example-file-system-structure} ### Example file-system structure {#example-file-system-structure}
```bash ```bash
website/i18n/<locale>/docusaurus-plugin-content-docs website/i18n/[locale]/docusaurus-plugin-content-docs
│ │
│ # translations for website/docs │ # translations for website/docs
├── current ├── current

8
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-content-pages.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-content-pages.md
View file

@ -122,15 +122,15 @@ Read the [i18n introduction](../../i18n/i18n-introduction.md) first.
### Translation files location {#translation-files-location} ### Translation files location {#translation-files-location}
- **Base path**: `website/i18n/<locale>/docusaurus-plugin-content-pages` - **Base path**: `website/i18n/[locale]/docusaurus-plugin-content-pages`
- **Multi-instance path**: `website/i18n/<locale>/docusaurus-plugin-content-pages-<pluginId>` - **Multi-instance path**: `website/i18n/[locale]/docusaurus-plugin-content-pages-[pluginId]`
- **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir) - **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir)
- **Markdown files**: `website/i18n/<locale>/docusaurus-plugin-content-pages` - **Markdown files**: `website/i18n/[locale]/docusaurus-plugin-content-pages`
### Example file-system structure {#example-file-system-structure} ### Example file-system structure {#example-file-system-structure}
```bash ```bash
website/i18n/<locale>/docusaurus-plugin-content-pages website/i18n/[locale]/docusaurus-plugin-content-pages
│ │
│ # translations for website/src/pages │ # translations for website/src/pages
├── first-markdown-page.md ├── first-markdown-page.md

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-debug.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-debug.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-google-analytics.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-google-analytics.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-google-gtag.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-google-gtag.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-ideal-image.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-ideal-image.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-pwa.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-pwa.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/plugins/plugin-sitemap.md → website/versioned_docs/version-2.0.0-beta.14/api/plugins/plugin-sitemap.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/themes/_category_.yml → website/versioned_docs/version-2.0.0-beta.14/api/themes/_category_.yml
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/themes/overview.md → website/versioned_docs/version-2.0.0-beta.14/api/themes/overview.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/themes/theme-classic.md → website/versioned_docs/version-2.0.0-beta.14/api/themes/theme-classic.md
View file

50
website/versioned_docs/version-2.0.0-beta.10/api/themes/theme-configuration.md → website/versioned_docs/version-2.0.0-beta.14/api/themes/theme-configuration.md
View file

@ -672,7 +672,7 @@ Accepted fields:
| `logo` | `Logo` | `undefined` | Customization of the logo object. See [Navbar logo](#navbar-logo) for details. | | `logo` | `Logo` | `undefined` | Customization of the logo object. See [Navbar logo](#navbar-logo) for details. |
| `copyright` | `string` | `undefined` | The copyright message to be displayed at the bottom. | | `copyright` | `string` | `undefined` | The copyright message to be displayed at the bottom. |
| `style` | <code>'dark' \| 'light'</code> | `'light'` | The color theme of the footer component. | | `style` | <code>'dark' \| 'light'</code> | `'light'` | The color theme of the footer component. |
| `items` | `FooterItem[]` | `[]` | The link groups to be present. | | `links` | <code>(Column \| FooterLink)[]</code> | `[]` | The link groups to be present. |
</APITable> </APITable>
@ -699,20 +699,20 @@ module.exports = {
### Footer Links {#footer-links} ### Footer Links {#footer-links}
You can add links to the footer via `themeConfig.footer.links`. You can add links to the footer via `themeConfig.footer.links`. There are two types of footer configurations: **multi-column footers** and **simple footers**.
Accepted fields of each link section: Multi-column footer links have a `title` and a list of `FooterItem`s for each column.
<APITable name="footer-links"> <APITable name="footer-links">
| Name | Type | Default | Description | | Name | Type | Default | Description |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| `title` | `string` | `undefined` | Label of the section of these links. | | `title` | `string` | `undefined` | Label of the section of these links. |
| `items` | `FooterLink[]` | `[]` | Links in this section. | | `items` | `FooterItem[]` | `[]` | Links in this section. |
</APITable> </APITable>
Accepted fields of each item in `items`: Accepted fields of each `FooterItem`:
<APITable name="footer-items"> <APITable name="footer-items">
@ -725,7 +725,7 @@ Accepted fields of each item in `items`:
</APITable> </APITable>
Example configuration: Example multi-column configuration:
```js title="docusaurus.config.js" ```js title="docusaurus.config.js"
module.exports = { module.exports = {
@ -775,6 +775,40 @@ module.exports = {
}; };
``` ```
A simple footer just has a list of `FooterItem`s displayed in a row.
Example simple configuration:
```js title="docusaurus.config.js"
module.exports = {
footer: {
// highlight-start
links: [
{
label: 'Stack Overflow',
href: 'https://stackoverflow.com/questions/tagged/docusaurus',
},
{
label: 'Discord',
href: 'https://discordapp.com/invite/docusaurus',
},
{
label: 'Twitter',
href: 'https://twitter.com/docusaurus',
},
{
html: `
<a href="https://www.netlify.com" target="_blank" rel="noreferrer noopener" aria-label="Deploys by Netlify">
<img src="https://www.netlify.com/img/global/badges/netlify-color-accent.svg" alt="Deploys by Netlify" />
</a>
`,
},
],
// highlight-end
},
};
```
## Table of Contents {#table-of-contents} ## Table of Contents {#table-of-contents}
You can adjust the default table of contents via `themeConfig.tableOfContents`. You can adjust the default table of contents via `themeConfig.tableOfContents`.
@ -846,7 +880,7 @@ Read the [i18n introduction](../../i18n/i18n-introduction.md) first.
### Translation files location {#translation-files-location} ### Translation files location {#translation-files-location}
- **Base path**: `website/i18n/<locale>/docusaurus-theme-<themeName>` - **Base path**: `website/i18n/[locale]/docusaurus-theme-[themeName]`
- **Multi-instance path**: N/A - **Multi-instance path**: N/A
- **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir) - **JSON files**: extracted with [`docusaurus write-translations`](../../cli.md#docusaurus-write-translations-sitedir)
- **Markdown files**: N/A - **Markdown files**: N/A
@ -854,7 +888,7 @@ Read the [i18n introduction](../../i18n/i18n-introduction.md) first.
### Example file-system structure {#example-file-system-structure} ### Example file-system structure {#example-file-system-structure}
```bash ```bash
website/i18n/<locale>/docusaurus-theme-classic website/i18n/[locale]/docusaurus-theme-classic
│ │
│ # translations for the theme │ # translations for the theme
├── navbar.json ├── navbar.json

0
website/versioned_docs/version-2.0.0-beta.10/api/themes/theme-live-codeblock.md → website/versioned_docs/version-2.0.0-beta.14/api/themes/theme-live-codeblock.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/api/themes/theme-search-algolia.md → website/versioned_docs/version-2.0.0-beta.14/api/themes/theme-search-algolia.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/assets/docusaurus-asset-example-banner.png → website/versioned_docs/version-2.0.0-beta.14/assets/docusaurus-asset-example-banner.png
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 68 KiB

Before After
Before After

0
website/versioned_docs/version-2.0.0-beta.10/assets/docusaurus-asset-example.docx → website/versioned_docs/version-2.0.0-beta.14/assets/docusaurus-asset-example.docx
View file

0
website/versioned_docs/version-2.0.0-beta.10/assets/docusaurus-asset-example.xyz → website/versioned_docs/version-2.0.0-beta.14/assets/docusaurus-asset-example.xyz
View file

48
website/versioned_docs/version-2.0.0-beta.10/blog.mdx → website/versioned_docs/version-2.0.0-beta.14/blog.mdx
View file

@ -328,7 +328,7 @@ authors:
The configuration file can be localized, just create a localized copy of it at: The configuration file can be localized, just create a localized copy of it at:
```bash ```bash
website/i18n/<locale>/docusaurus-plugin-content-blog/authors.yml website/i18n/[locale]/docusaurus-plugin-content-blog/authors.yml
``` ```
</details> </details>
@ -455,12 +455,14 @@ module.exports = {
## Feed {#feed} ## Feed {#feed}
You can generate RSS/Atom feed by passing feedOptions. By default, RSS and Atom feeds are generated. To disable feed generation, set `feedOptions.type` to `null`. You can generate RSS / Atom / JSON feed by passing `feedOptions`. By default, RSS and Atom feeds are generated. To disable feed generation, set `feedOptions.type` to `null`.
```ts ```ts
type FeedType = 'rss' | 'atom' | 'json';
type BlogOptions = { type BlogOptions = {
feedOptions?: { feedOptions?: {
type?: 'rss' | 'atom' | 'all' | null; type?: FeedType | 'all' | FeedType[] | null;
title?: string; title?: string;
description?: string; description?: string;
copyright: string; copyright: string;
@ -490,37 +492,51 @@ module.exports = {
}; };
``` ```
Accessing the feed: The feeds can be found at:
The feed for RSS can be found at: <Tabs>
<TabItem value="RSS">
```text ```text
https://{your-domain}/blog/rss.xml https://example.com/blog/rss.xml
``` ```
and for Atom: </TabItem>
<TabItem value="Atom">
```text ```text
https://{your-domain}/blog/atom.xml https://example.com/blog/atom.xml
``` ```
</TabItem>
<TabItem value="JSON">
```text
https://example.com/blog/feed.json
```
</TabItem>
</Tabs>
## Advanced topics {#advanced-topics} ## Advanced topics {#advanced-topics}
### Blog-only mode {#blog-only-mode} ### Blog-only mode {#blog-only-mode}
You can run your Docusaurus 2 site without a landing page and instead have your blog's post list page as the index page. Set the `routeBasePath` to be `'/'` to indicate it's the root path. You can run your Docusaurus 2 site without a dedicated landing page and instead have your blog's post list page as the index page. Set the `routeBasePath` to be `'/'` to serve the blog through the root route `example.com/` instead of the subroute `example.com/blog/`.
```js {10} title="docusaurus.config.js" ```js title="docusaurus.config.js"
module.exports = { module.exports = {
// ... // ...
presets: [ presets: [
[ [
'@docusaurus/preset-classic', '@docusaurus/preset-classic',
{ {
docs: false, // highlight-next-line
docs: false, // Optional: disable the docs plugin
blog: { blog: {
path: './blog', // highlight-next-line
routeBasePath: '/', // Set this value to '/'. routeBasePath: '/', // Serve the blog at the site's root
/* other blog options */
}, },
}, },
], ],
@ -534,6 +550,12 @@ Don't forget to delete the existing homepage at `./src/pages/index.js` or else t
::: :::
:::tip
There's also a "Docs-only mode" for those who only want to use the docs. Read [Docs-only mode](./guides/docs/docs-introduction.md) for detailed instructions or a more elaborated explanation of `routeBasePath`.
:::
### Multiple blogs {#multiple-blogs} ### Multiple blogs {#multiple-blogs}
By default, the classic theme assumes only one blog per website and hence includes only one instance of the blog plugin. If you would like to have multiple blogs on a single website, it's possible too! You can add another blog by specifying another blog plugin in the `plugins` option for `docusaurus.config.js`. By default, the classic theme assumes only one blog per website and hence includes only one instance of the blog plugin. If you would like to have multiple blogs on a single website, it's possible too! You can add another blog by specifying another blog plugin in the `plugins` option for `docusaurus.config.js`.

0
website/versioned_docs/version-2.0.0-beta.10/browser-support.md → website/versioned_docs/version-2.0.0-beta.14/browser-support.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/cli.md → website/versioned_docs/version-2.0.0-beta.14/cli.md
View file

8
website/versioned_docs/version-2.0.0-beta.10/configuration.md → website/versioned_docs/version-2.0.0-beta.14/configuration.md
View file

@ -66,11 +66,11 @@ module.exports = {
When it sees a plugin / theme / preset name, it tries to load one of the following, in that order: When it sees a plugin / theme / preset name, it tries to load one of the following, in that order:
- `{name}` - `[name]`
- `@docusaurus/{type}-{name}` - `@docusaurus/[moduleType]-[name]`
- `docusaurus-{type}-{name}`, - `docusaurus-[moduleType]-[name]`,
where `type` is one of `'preset'`, `'theme'`, `'plugin'`, depending on which field the module name is declared in. The first module name that's successfully found is loaded. where `moduleType` is one of `'preset'`, `'theme'`, `'plugin'`, depending on which field the module name is declared in. The first module name that's successfully found is loaded.
If the name is scoped (beginning with `@`), the name is first split into scope and package name by the first slash: If the name is scoped (beginning with `@`), the name is first split into scope and package name by the first slash:

0
website/versioned_docs/version-2.0.0-beta.10/deployment.mdx → website/versioned_docs/version-2.0.0-beta.14/deployment.mdx
View file

14
website/versioned_docs/version-2.0.0-beta.10/docusaurus-core.md → website/versioned_docs/version-2.0.0-beta.14/docusaurus-core.md
View file

@ -249,7 +249,7 @@ export default function VisitMyWebsiteMessage() {
When [localizing your site](./i18n/i18n-introduction.md), the `<Translate/>` component will allow providing **translation support to React components**, such as your homepage. The `<Translate>` component supports [interpolation](#interpolate). When [localizing your site](./i18n/i18n-introduction.md), the `<Translate/>` component will allow providing **translation support to React components**, such as your homepage. The `<Translate>` component supports [interpolation](#interpolate).
The translation strings will be extracted from your code with the [`docusaurus write-translations`](./cli.md#docusaurus-write-translations-sitedir) CLI and create a `code.json` translation file in `website/i18n/<locale>`. The translation strings will be extracted from your code with the [`docusaurus write-translations`](./cli.md#docusaurus-write-translations-sitedir) CLI and create a `code.json` translation file in `website/i18n/[locale]`.
:::note :::note
@ -312,7 +312,7 @@ You can even omit a children prop and specify a translation string in your `code
## Hooks {#hooks} ## Hooks {#hooks}
### `useDocusaurusContext` {#usedocusauruscontext} ### `useDocusaurusContext` {#useDocusaurusContext}
React hook to access Docusaurus Context. Context contains `siteConfig` object from [docusaurus.config.js](api/docusaurus.config.js.md), and some additional site metadata. React hook to access Docusaurus Context. Context contains `siteConfig` object from [docusaurus.config.js](api/docusaurus.config.js.md), and some additional site metadata.
@ -396,7 +396,7 @@ const MyComponent = () => {
}; };
``` ```
### `useBaseUrl` {#usebaseurl} ### `useBaseUrl` {#useBaseUrl}
React hook to prepend your site `baseUrl` to a string. React hook to prepend your site `baseUrl` to a string.
@ -446,7 +446,7 @@ Prefer a `require()` call for [assets](./guides/markdown-features/markdown-featu
::: :::
### `useBaseUrlUtils` {#usebaseurlutils} ### `useBaseUrlUtils` {#useBaseUrlUtils}
Sometimes `useBaseUrl` is not good enough. This hook return additional utils related to your site's base url. Sometimes `useBaseUrl` is not good enough. This hook return additional utils related to your site's base url.
@ -466,7 +466,7 @@ const Component = () => {
}; };
``` ```
### `useGlobalData` {#useglobaldata} ### `useGlobalData` {#useGlobalData}
React hook to access Docusaurus global data created by all the plugins. React hook to access Docusaurus global data created by all the plugins.
@ -507,7 +507,7 @@ Inspect your site's global data at `./docusaurus/globalData.json`
::: :::
### `usePluginData` {#useplugindata} ### `usePluginData` {#usePluginData}
Access global data created by a specific plugin instance. Access global data created by a specific plugin instance.
@ -531,7 +531,7 @@ const MyComponent = () => {
}; };
``` ```
### `useAllPluginInstancesData` {#useallplugininstancesdata} ### `useAllPluginInstancesData` {#useAllPluginInstancesData}
Access global data created by a specific plugin. Given a plugin name, it returns the data of all the plugins instances of that name, by plugin id. Access global data created by a specific plugin. Given a plugin name, it returns the data of all the plugins instances of that name, by plugin id.

8
website/versioned_docs/version-2.0.0-beta.10/guides/creating-pages.md → website/versioned_docs/version-2.0.0-beta.14/guides/creating-pages.md
View file

@ -97,10 +97,10 @@ You can use the full power of React in Markdown pages too, refer to the [MDX](ht
If you are familiar with other static site generators like Jekyll and Next, this routing approach will feel familiar to you. Any JavaScript file you create under `/src/pages/` directory will be automatically converted to a website page, following the `/src/pages/` directory hierarchy. For example: If you are familiar with other static site generators like Jekyll and Next, this routing approach will feel familiar to you. Any JavaScript file you create under `/src/pages/` directory will be automatically converted to a website page, following the `/src/pages/` directory hierarchy. For example:
- `/src/pages/index.js` → `<baseUrl>` - `/src/pages/index.js` → `[baseUrl]`
- `/src/pages/foo.js` → `<baseUrl>/foo` - `/src/pages/foo.js` → `[baseUrl]/foo`
- `/src/pages/foo/test.js` → `<baseUrl>/foo/test` - `/src/pages/foo/test.js` → `[baseUrl]/foo/test`
- `/src/pages/foo/index.js` → `<baseUrl>/foo/` - `/src/pages/foo/index.js` → `[baseUrl]/foo/`
In this component-based development era, it is encouraged to co-locate your styling, markup and behavior together into components. Each page is a component, and if you need to customize your page design with your own styles, we recommend co-locating your styles with the page component in its own directory. For example, to create a "Support" page, you could do one of the following: In this component-based development era, it is encouraged to co-locate your styling, markup and behavior together into components. Each page is a component, and if you need to customize your page design with your own styles, we recommend co-locating your styles with the page component in its own directory. For example, to create a "Support" page, you could do one of the following:

0
website/versioned_docs/version-2.0.0-beta.10/guides/docs/docs-create-doc.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/docs/docs-create-doc.mdx
View file

159
website/versioned_docs/version-2.0.0-beta.14/guides/docs/docs-introduction.md Normal file
View file

@ -0,0 +1,159 @@
---
id: introduction
title: Docs Introduction
sidebar_label: Introduction
slug: /docs-introduction
---
The docs feature provides users with a way to organize Markdown files in a hierarchical format.
:::info
Check the [Docs Plugin API Reference documentation](./../../api/plugins/plugin-content-docs.md) for an exhaustive list of options.
:::
## Document ID {#document-id}
Every document has a unique `id`. By default, a document `id` is the name of the document (without the extension) relative to the root docs directory.
For example, `greeting.md` id is `greeting` and `guide/hello.md` id is `guide/hello`.
```bash
website # Root directory of your site
└── docs
├── greeting.md
└── guide
└── hello.md
```
However, the **last part** of the `id` can be defined by user in the front matter. For example, if `guide/hello.md`'s content is defined as below, its final `id` is `guide/part1`.
```yml
---
id: part1
---
Lorem ipsum
```
If you want more control over the last part of the document URL, it is possible to add a `slug` (defaults to the `id`).
```yml
---
id: part1
slug: part1.html
---
Lorem ipsum
```
:::note
It is possible to use:
- absolute slugs: `slug: /mySlug`, `slug: /`...
- relative slugs: `slug: mySlug`, `slug: ./../mySlug`...
:::
## Home page docs {#home-page-docs}
If you want a document to be available at the root, and have a path like `https://docusaurus.io/docs/`, you can use the slug frontmatter:
```yml
---
id: my-home-doc
slug: /
---
Lorem ipsum
```
## Docs-only mode {#docs-only-mode}
A freshly initialized Docusaurus site has the following structure:
```
example.com/ -> generated from `src/pages/index.js`
example.com/docs/intro -> generated from `docs/intro.md`
example.com/docs/tutorial-basics/... -> generated from `docs/tutorial-basics/...`
...
example.com/blog/2021/08/26/welcome -> generated from `blog/2021-08-26-welcome/index.md`
example.com/blog/2021/08/01/mdx-blog-post -> generated from `blog/2021-08-01-mdx-blog-post.mdx`
...
```
All docs will be served under the subroute `docs/`. But what if **your site only has docs**, or you want to prioritize your docs by putting it at the root?
Assume that you have the following in your configuration:
```js title="docusaurus.config.js"
module.exports = {
// ...
presets: [
'@docusaurus/preset-classic',
{
docs: {
/* docs plugin options */
},
blog: {
/* blog plugin options */
},
// ...
},
],
};
```
To enter docs-only mode, change it to like this:
```js title="docusaurus.config.js"
module.exports = {
// ...
presets: [
'@docusaurus/preset-classic',
{
docs: {
// highlight-next-line
routeBasePath: '/', // Serve the docs at the site's root
/* other docs plugin options */
},
// highlight-next-line
blog: false, // Optional: disable the blog plugin
// ...
},
],
};
```
Note that you **don't necessarily have to give up on using blog** or other plugins; all that `routeBasePath: '/'` does is that instead of serving the docs through `https://example.com/docs/some-doc`, they are now at the site root: `https://example.com/some-doc`. The blog, if enabled, can still be accessed through the `blog/` subroute.
Don't forget to put some page at the root (`https://example.com/`) through adding the front matter:
```yml title="docs/intro.md"
---
# highlight-next-line
slug: /
---
This page will be the home page when users visit https://example.com/.
```
:::caution
If you added `slug: /` to a doc to make it the homepage, you should delete the existing homepage at `./src/pages/index.js`, or else there will be two files mapping to the same route!
:::
Now, the site's structure will be like the following:
```
example.com/ -> generated from `docs/intro.md`
example.com/tutorial-basics/... -> generated from `docs/tutorial-basics/...`
...
```
:::tip
There's also a "blog-only mode" for those who only want to use the blog feature of Docusaurus 2. You can use the same method detailed above. Follow the setup instructions on [Blog-only mode](../../blog.mdx#blog-only-mode).
:::

0
website/versioned_docs/version-2.0.0-beta.10/guides/docs/docs-markdown-features.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/docs/docs-markdown-features.mdx
View file

6
website/versioned_docs/version-2.0.0-beta.10/guides/docs/docs-multi-instance.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/docs/docs-multi-instance.mdx
View file

@ -150,9 +150,9 @@ The default plugin instance will use these paths:
The other plugin instances (with an `id` attribute) will use these paths: The other plugin instances (with an `id` attribute) will use these paths:
- `website/<pluginId>_versions.json` - `website/[pluginId]_versions.json`
- `website/<pluginId>_versioned_docs` - `website/[pluginId]_versioned_docs`
- `website/<pluginId>_versioned_sidebars` - `website/[pluginId]_versioned_sidebars`
:::tip :::tip

521
website/versioned_docs/version-2.0.0-beta.10/guides/docs/sidebar.md → website/versioned_docs/version-2.0.0-beta.14/guides/docs/sidebar.md
View file

@ -5,6 +5,11 @@ toc_max_heading_level: 5
slug: /sidebar slug: /sidebar
--- ---
```mdx-code-block
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
```
Creating a sidebar is useful to: Creating a sidebar is useful to:
- Group multiple **related documents** - Group multiple **related documents**
@ -13,8 +18,8 @@ Creating a sidebar is useful to:
To use sidebars on your Docusaurus site: To use sidebars on your Docusaurus site:
1. Define a file that exports a [sidebar object](#sidebar-object). 1. Define a file that exports a dictionary of [sidebar objects](#sidebar-object).
1. Pass this object into the `@docusaurus/plugin-docs` plugin directly or via `@docusaurus/preset-classic`. 2. Pass this object into the `@docusaurus/plugin-docs` plugin directly or via `@docusaurus/preset-classic`.
```js title="docusaurus.config.js" ```js title="docusaurus.config.js"
module.exports = { module.exports = {
@ -32,16 +37,16 @@ module.exports = {
}; };
``` ```
## Default sidebar ## Default sidebar {#default-sidebar}
By default, Docusaurus [automatically generates a sidebar](#sidebar-item-autogenerated) for you, by using the filesystem structure of the `docs` folder: If the `sidebarPath` is unspecified, Docusaurus [automatically generates a sidebar](#sidebar-item-autogenerated) for you, by using the filesystem structure of the `docs` folder:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
mySidebar: [ mySidebar: [
{ {
type: 'autogenerated', type: 'autogenerated',
dirName: '.', // generate sidebar slice from the docs folder (or versioned_docs/<version>) dirName: '.', // generate sidebar from the docs folder (or versioned_docs/<version>)
}, },
], ],
}; };
@ -51,30 +56,17 @@ You can also define your sidebars explicitly.
## Sidebar object {#sidebar-object} ## Sidebar object {#sidebar-object}
A sidebar is a **tree of [sidebar items](#understanding-sidebar-items)**. A sidebar at its crux is a hierarchy of categories, doc links, and other hyperlinks.
```typescript ```typescript
type Sidebar = type Sidebar =
// Normal syntax // Normal syntax
| SidebarItem[] | SidebarItem[]
// Shorthand syntax // Shorthand syntax
| Record< | {[categoryLabel: string]: SidebarItem[]};
string, // category label
SidebarItem[] // category items
>;
``` ```
A sidebars file can contain **multiple sidebar objects**. For example:
```typescript
type SidebarsFile = Record<
string, // sidebar id
Sidebar
>;
```
Example:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
@ -82,86 +74,174 @@ module.exports = {
{ {
type: 'category', type: 'category',
label: 'Getting Started', label: 'Getting Started',
items: ['doc1'], items: [
{
type: 'doc',
id: 'doc1',
},
],
}, },
{ {
type: 'category', type: 'category',
label: 'Docusaurus', label: 'Docusaurus',
items: ['doc2', 'doc3'], items: [
{
type: 'doc',
id: 'doc2',
},
{
type: 'doc',
id: 'doc3',
},
],
},
{
type: 'link',
label: 'Learn more',
href: 'https://example.com',
}, },
], ],
}; };
``` ```
Notice the following: This is a sidebars file that exports one sidebar, called `mySidebar`. It has three top-level items: two categories and one external link. Within each category, there are a few doc links.
- There is a single sidebar `mySidebar`, containing 5 [sidebar items](#understanding-sidebar-items) A sidebars file can contain [**multiple sidebar objects**](#using-multiple-sidebars), identified by their object keys.
- `Getting Started` and `Docusaurus` are sidebar categories
- `doc1`, `doc2` and `doc3` are sidebar documents
:::tip ```typescript
type SidebarsFile = {
Use the **shorthand syntax** to express this sidebar more concisely: [sidebarID: string]: Sidebar;
```js title="sidebars.js"
module.exports = {
mySidebar: {
'Getting started': ['doc1'],
Docusaurus: ['doc2', 'doc3'],
},
}; };
``` ```
::: ### Using shorthands {#using-shorthands}
## Using multiple sidebars {#using-multiple-sidebars} You can express typical sidebar items without much customization more concisely with **shorthand syntaxes**. There are two parts to this: [**doc shorthand**](#doc-shorthand) and [**category shorthand**](#category-shorthand).
You can create a sidebar for each **set of Markdown files** that you want to **group together**. #### Doc shorthand {#doc-shorthand}
:::tip An item with type `doc` can be simply a string representing its ID:
The Docusaurus site is a good example of using multiple sidebars: ```js
// =================
// This item:
// =================
{
type: 'doc',
id: 'myDoc',
};
// =================
// Is equivalent to:
// =================
'myDoc';
```
- [Docs](../../introduction.md) So it's possible to simplify the example above to:
- [API](../../cli.md)
:::
Example:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
tutorialSidebar: { mySidebar: [
'Category A': ['doc1', 'doc2'], {
}, type: 'category',
apiSidebar: ['doc3', 'doc4'], label: 'Getting Started',
items: [
// highlight-next-line
'doc1',
],
},
{
type: 'category',
label: 'Docusaurus',
items: [
// highlight-start
'doc2',
'doc3',
// highlight-end
],
},
{
type: 'link',
label: 'Learn more',
href: 'https://example.com',
},
],
}; };
``` ```
:::note #### Category shorthand {#category-shorthand}
The keys `tutorialSidebar` and `apiSidebar` are sidebar **technical ids** and do not matter much. A category item can be represented by an object whose key is its label, and the value is an array of subitems.
::: ```js
// ===================
// This item:
// ===================
{
type: 'category',
label: 'Getting started',
items: ['doc1', 'doc2'],
};
// ===================
// Is equivalent to:
// ===================
{
'Getting started': ['doc1', 'doc2'],
};
```
When browsing: This permits us to simplify that example to:
- `doc1` or `doc2`: the `tutorialSidebar` will be displayed ```js title="sidebars.js"
- `doc3` or `doc4`: the `apiSidebar` will be displayed module.exports = {
mySidebar: [
// highlight-start
{
'Getting started': ['doc1'],
},
{
Docusaurus: ['doc2', 'doc3'],
},
// highlight-end
{
type: 'link',
label: 'Learn more',
href: 'https://example.com',
},
],
};
```
A **paginated navigation** link documents inside the same sidebar with **next and previous buttons**. Each shorthand object after this transformation will contain exactly one entry. Now consider the further simplified example below:
```js title="sidebars.js"
module.exports = {
mySidebar: [
// highlight-start
{
'Getting started': ['doc1'],
Docusaurus: ['doc2', 'doc3'],
},
// highlight-end
{
type: 'link',
label: 'Learn more',
href: 'https://example.com',
},
],
};
```
Note how the two consecutive category shorthands are compressed into one object with two entries. This syntax generates a **sidebar slice**: you shouldn't see that object as one bulk item—this object is unwrapped, with each entry becoming a separate item, and they spliced together with the rest of the items (in this case, the "Learn more" link) to form the final sidebar level. Sidebar slices are also important when discussing [autogenerated sidebars](#sidebar-item-autogenerated).
## Understanding sidebar items {#understanding-sidebar-items} ## Understanding sidebar items {#understanding-sidebar-items}
`SidebarItem` is an item defined in a Sidebar tree. We have introduced three types of item types in the above example: `doc`, `category`, and `link`, whose usage are fairly intuitive. We will formally introduce their APIs. There's also a fourth type: `autogenerated`, which we will explain in detail later.
There are different types of sidebar items: - **[Doc](#sidebar-item-doc)**: link to a doc page, associating it with the sidebar
- **[Doc](#sidebar-item-doc)**: link to a doc page, assigning it to the sidebar
- **[Ref](#sidebar-item-ref)**: link to a doc page, without assigning it to the sidebar
- **[Link](#sidebar-item-link)**: link to any internal or external page - **[Link](#sidebar-item-link)**: link to any internal or external page
- **[Category](#sidebar-item-category)**: create a hierarchy of sidebar items - **[Category](#sidebar-item-category)**: creates a dropdown of sidebar items
- **[Autogenerated](#sidebar-item-autogenerated)**: generate a sidebar slice automatically - **[Autogenerated](#sidebar-item-autogenerated)**: generate a sidebar slice automatically
- **[\*Ref](#sidebar-association)**: link to a doc page, without associating it with the sidebar
### Doc: link to a doc {#sidebar-item-doc} ### Doc: link to a doc {#sidebar-item-doc}
@ -203,40 +283,14 @@ module.exports = {
}; };
``` ```
The `sidebar_label` markdown frontmatter has a higher precedence over the `label` key in `SidebarItemDoc`. If you use the doc shorthand or [autogenerated](#sidebar-item-autogenerated) sidebar, you would lose the ability to customize the sidebar label through item definition. You can, however, use the `sidebar_label` markdown front matter within that doc, which has a higher precedence over the `label` key in the sidebar item.
:::note :::note
Don't assign the same doc to multiple sidebars: use a [ref](#sidebar-item-ref) instead. A `doc` item sets an [implicit sidebar association](#sidebar-association). Don't assign the same doc to multiple sidebars: change the type to `ref` instead.
::: :::
### Ref: link to a doc, without sidebar {#sidebar-item-ref}
Use the `ref` type to link to a doc page without assigning it to a sidebar.
```typescript
type SidebarItemRef = {
type: 'ref';
id: string;
};
```
Example:
```js title="sidebars.js"
module.exports = {
mySidebar: [
{
type: 'ref',
id: 'doc1', // Document id (string).
},
],
};
```
When browsing `doc1`, Docusaurus **will not display** the `mySidebar` sidebar.
### Link: link to any page {#sidebar-item-link} ### Link: link to any page {#sidebar-item-link}
Use the `link` type to link to any page (internal or external) that is not a doc. Use the `link` type to link to any page (internal or external) that is not a doc.
@ -319,7 +373,7 @@ module.exports = {
:::tip :::tip
Use the **shorthand syntax** when you don't need **category options**: Use the [**shorthand syntax**](#category-shorthand) when you don't need customizations:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
@ -369,7 +423,7 @@ See it in action in the [i18n introduction page](../../i18n/i18n-introduction.md
##### Generated index page {#generated-index-page} ##### Generated index page {#generated-index-page}
You can auto-generate an index page that displays all the direct children of this category. The `slug` allows you to customize the generated page's route, which defaults to `/category/{{category name}}`. You can auto-generate an index page that displays all the direct children of this category. The `slug` allows you to customize the generated page's route, which defaults to `/category/[categoryName]`.
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
@ -424,7 +478,7 @@ module.exports = {
}; };
``` ```
To make all categories non-collapsible by default, set the `sidebarCollapsible` option in `plugin-docs` to `false`: To make all categories non-collapsible by default, set the `sidebarCollapsible` option in `plugin-content-docs` to `false`:
```js title="docusaurus.config.js" ```js title="docusaurus.config.js"
module.exports = { module.exports = {
@ -493,11 +547,9 @@ When a category has `collapsed: true` but `collapsible: false` (either through `
::: :::
### Autogenerated: generate a sidebar {#sidebar-item-autogenerated} ### Autogenerated: generate a sidebar slice {#sidebar-item-autogenerated}
Docusaurus can **create a sidebar automatically** from your **filesystem structure**: each folder creates a sidebar category. Docusaurus can **create a sidebar automatically** from your **filesystem structure**: each folder creates a sidebar category, and each file creates a doc link.
An `autogenerated` item is converted by Docusaurus to a **sidebar slice**: a list of items of type `doc` and `category`.
```typescript ```typescript
type SidebarItemAutogenerated = { type SidebarItemAutogenerated = {
@ -506,7 +558,7 @@ type SidebarItemAutogenerated = {
}; };
``` ```
Docusaurus can generate a sidebar from your docs folder: Docusaurus can generate a full sidebar from your docs folder:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
@ -521,7 +573,37 @@ module.exports = {
}; };
``` ```
You can also use **multiple `autogenerated` items** in a sidebar, and interleave them with regular sidebar items: An `autogenerated` item is converted by Docusaurus to a **sidebar slice** (also discussed in [category shorthands](#category-shorthand)): a list of items of type `doc` or `category`, so you can splice **multiple `autogenerated` items** from multiple directories, interleaving them with regular sidebar items, in one sidebar level.
<details>
<summary>A real world example</summary>
Consider this file structure:
```bash
docs
├── api
│ ├── product1-api
│ │ └── api.md
│ └── product2-api
│ ├── basic-api.md
│ └── pro-api.md
├── intro.md
└── tutorials
├── advanced
│ ├── advanced1.md
│ ├── advanced2.md
│ └── read-more
│ ├── resource1.md
│ └── resource2.md
├── easy
│ ├── easy1.md
│ └── easy2.md
├── tutorial-end.md
├── tutorial-intro.md
└── tutorial-medium.md
```
And assume every doc's ID is just its file name. If you define an autogenerated sidebar like this:
```js title="sidebars.js" ```js title="sidebars.js"
module.exports = { module.exports = {
@ -551,7 +633,7 @@ module.exports = {
// highlight-start // highlight-start
{ {
type: 'autogenerated', type: 'autogenerated',
dirName: 'guides', // Generate sidebar slice from docs/guides dirName: 'api', // Generate sidebar slice from docs/api
}, },
// highlight-end // highlight-end
{ {
@ -563,6 +645,62 @@ module.exports = {
}; };
``` ```
It would be resolved as:
```js title="sidebars.js"
module.exports = {
mySidebar: [
'intro',
{
type: 'category',
label: 'Tutorials',
items: [
'tutorial-intro',
// highlight-start
// Two files in docs/tutorials/easy
'easy1',
'easy2',
// highlight-end
'tutorial-medium',
// highlight-start
// Two files and a folder in docs/tutorials/hard
'advanced1',
'advanced2',
{
type: 'category',
label: 'read-more',
items: ['resource1', 'resource2'],
},
// highlight-end
'tutorial-end',
],
},
// highlight-start
// Two folders in docs/api
{
type: 'category',
label: 'product1-api',
items: ['api'],
},
{
type: 'category',
label: 'product2-api',
items: ['basic-api', 'pro-api'],
},
// highlight-end
{
type: 'category',
label: 'Community',
items: ['team', 'chat'],
},
],
};
```
Note how the autogenerate source directories themselves don't become categories: only the items they contain do. This is what we mean by "sidebar slice".
</details>
#### Category index convention {#category-index-convention} #### Category index convention {#category-index-convention}
Docusaurus can automatically link a category to its index document. Docusaurus can automatically link a category to its index document.
@ -598,29 +736,34 @@ Naming your introductory document `README.md` makes it show up when browsing the
#### Autogenerated sidebar metadata {#autogenerated-sidebar-metadata} #### Autogenerated sidebar metadata {#autogenerated-sidebar-metadata}
By default, the sidebar slice will be generated in **alphabetical order** (using files and folders names). For hand-written sidebar definitions, you would provide metadata to sidebar items through `sidebars.js`; for autogenerated, Docusaurus would read them from the item's respective file. In addition, you may want to adjust the relative position of each item, because by default, items within a sidebar slice will be generated in **alphabetical order** (using files and folders names).
If the generated sidebar does not look good, you can assign additional metadata to docs and categories. **For docs**: use additional front matter. The `label` and `className` attributes now become `sidebar_label` and `sidebar_class_name`, while there's an additional `sidebar_position` front matter.
**For docs**: use additional front matter: ```yaml title="docs/tutorials/tutorial-easy.md"
```md title="docs/tutorials/tutorial-easy.md" {1-4}
--- ---
sidebar_label: Easy # highlight-start
sidebar_position: 2 sidebar_position: 2
sidebar_label: Easy
sidebar_class_name: green
# highlight-end
--- ---
# Easy Tutorial # Easy Tutorial
This is the easy tutorial! This is the easy tutorial!
``` ```
**For categories**: add a `_category_.json` or `_category_.yml` file in the appropriate folder: **For categories**: add a `_category_.json` or `_category_.yml` file in the respective folder. You can specify any category metadata and also the `position` metadata.
<Tabs>
<TabItem value="JSON">
```json title="docs/tutorials/_category_.json" ```json title="docs/tutorials/_category_.json"
{ {
"position": 2.5,
"label": "Tutorial", "label": "Tutorial",
"position": 3, "collapsible": true,
"collapsed": false,
"className": "red", "className": "red",
"link": { "link": {
"type": "generated-index", "type": "generated-index",
@ -629,6 +772,23 @@ This is the easy tutorial!
} }
``` ```
</TabItem>
<TabItem value="YAML">
```yaml title="docs/tutorials/_category_.yml"
position: 2.5 # float position is supported
label: 'Tutorial'
collapsible: true # make the category collapsible
collapsed: false # keep the category open by default
className: red
link:
type: generated-index
title: Tutorial overview
```
</TabItem>
</Tabs>
:::info :::info
If the `link` is explicitly specified, Docusaurus will not apply any [default conventions](#category-index-convention). If the `link` is explicitly specified, Docusaurus will not apply any [default conventions](#category-index-convention).
@ -637,35 +797,28 @@ The doc links can be specified relatively, e.g. if the category is generated wit
::: :::
```yaml title="docs/tutorials/_category_.yml"
label: 'Tutorial'
position: 2.5 # float position is supported
collapsible: true # make the category collapsible
collapsed: false # keep the category open by default
```
:::info :::info
The position metadata is only used **inside a sidebar slice**: Docusaurus does not re-order other items of your sidebar. The position metadata is only used **within a sidebar slice**: Docusaurus does not re-order other items of your sidebar.
::: :::
#### Using number prefixes #### Using number prefixes
A simple way to order an autogenerated sidebar is to prefix docs and folders by number prefixes: A simple way to order an autogenerated sidebar is to prefix docs and folders by number prefixes, which also makes them appear in the file system in the same order when sorted by file name:
```bash ```bash
docs docs
├── 01-Intro.md ├── 01-Intro.md
├── 02-Tutorial Easy ├── 02-Tutorial Easy
│   ├── 01-First Part.md │ ├── 01-First Part.md
│   ├── 02-Second Part.md │ ├── 02-Second Part.md
│   └── 03-End.md │ └── 03-End.md
├── 03-Tutorial Hard ├── 03-Tutorial Hard
│   ├── 01-First Part.md │ ├── 01-First Part.md
│   ├── 02-Second Part.md │ ├── 02-Second Part.md
│   ├── 03-Third Part.md │ ├── 03-Third Part.md
│   └── 04-End.md │ └── 04-End.md
└── 04-End.md └── 04-End.md
``` ```
@ -697,7 +850,7 @@ module.exports = {
'@docusaurus/plugin-content-docs', '@docusaurus/plugin-content-docs',
{ {
// highlight-start // highlight-start
sidebarItemsGenerator: async function ({ async sidebarItemsGenerator({
defaultSidebarItemsGenerator, defaultSidebarItemsGenerator,
numberPrefixParser, numberPrefixParser,
item, item,
@ -707,7 +860,7 @@ module.exports = {
// Example: return an hardcoded list of static sidebar items // Example: return an hardcoded list of static sidebar items
return [ return [
{type: 'doc', id: 'doc1'}, {type: 'doc', id: 'doc1'},
{type: 'doc', id: 'doc2'}, {type: 'doc', id: 'doc2'}},
]; ];
}, },
// highlight-end // highlight-end
@ -719,7 +872,7 @@ module.exports = {
:::tip :::tip
**Re-use and enhance the default generator** instead of writing a generator from scratch. **Re-use and enhance the default generator** instead of writing a generator from scratch: [the default generator we provide](https://github.com/facebook/docusaurus/blob/main/packages/docusaurus-plugin-content-docs/src/sidebars/generator.ts) is 250 lines long.
**Add, update, filter, re-order** the sidebar items according to your use-case: **Add, update, filter, re-order** the sidebar items according to your use-case:
@ -746,10 +899,7 @@ module.exports = {
'@docusaurus/plugin-content-docs', '@docusaurus/plugin-content-docs',
{ {
// highlight-start // highlight-start
sidebarItemsGenerator: async function ({ async sidebarItemsGenerator({defaultSidebarItemsGenerator, ...args}) {
defaultSidebarItemsGenerator,
...args
}) {
const sidebarItems = await defaultSidebarItemsGenerator(args); const sidebarItems = await defaultSidebarItemsGenerator(args);
return reverseSidebarItems(sidebarItems); return reverseSidebarItems(sidebarItems);
}, },
@ -764,7 +914,7 @@ module.exports = {
## Hideable sidebar {#hideable-sidebar} ## Hideable sidebar {#hideable-sidebar}
Using the enabled `themeConfig.hideableSidebar` option, you can make the entire sidebar hidden, allowing you to better focus your users on the content. This is especially useful when content consumption on medium screens (e.g. on tablets). By enabling the `themeConfig.hideableSidebar` option, you can make the entire sidebar hideable, allowing users to better focus on the content. This is especially useful when content is consumed on medium-sized screens (e.g. tablets).
```js title="docusaurus.config.js" ```js title="docusaurus.config.js"
module.exports = { module.exports = {
@ -776,6 +926,99 @@ module.exports = {
}; };
``` ```
## Using multiple sidebars {#using-multiple-sidebars}
You can create a sidebar for each **set of Markdown files** that you want to **group together**.
:::tip
The Docusaurus site is a good example of using multiple sidebars:
- [Docs](../../introduction.md)
- [API](../../cli.md)
:::
Consider this example:
```js title="sidebars.js"
module.exports = {
tutorialSidebar: {
'Category A': ['doc1', 'doc2'],
},
apiSidebar: ['doc3', 'doc4'],
};
```
When browsing `doc1` or `doc2`, the `tutorialSidebar` will be displayed; when browsing `doc3` or `doc4`, the `apiSidebar` will be displayed.
### Understanding sidebar association {#sidebar-association}
Following the example above, if a `commonDoc` is included in both sidebars:
```js title="sidebars.js"
module.exports = {
tutorialSidebar: {
'Category A': ['doc1', 'doc2', 'commonDoc'],
},
apiSidebar: ['doc3', 'doc4', 'commonDoc'],
};
```
How does Docusaurus know which sidebar to display when browsing `commonDoc`? Answer: it doesn't, and we don't guarantee which sidebar it will pick. In this case, in order to remove the ambiguity, you can use the special `ref` sidebar item type.
The `ref` type is identical to the [`doc` type](#sidebar-item-doc) in every way, except that it doesn't set the association. It only registers itself as a link, but doesn't take part in generating navigation metadata. When [generating pagination](#generating-pagination) and displaying sidebar, `ref` items are completely ignored.
So you can turn the sidebars above into:
```js title="sidebars.js"
module.exports = {
tutorialSidebar: {
'Category A': [
'doc1',
'doc2',
// highlight-next-line
{type: 'ref', id: 'commonDoc'},
],
},
apiSidebar: ['doc3', 'doc4', 'commonDoc'],
};
```
Now, although the link to `commonDoc` is still included in the `tutorialSidebar` sidebar, when browsing `commonDoc`, only `apiSidebar` can be possibly displayed.
### Generating pagination {#generating-pagination}
Docusaurus uses the sidebar to generate the "next" and "previous" pagination links at the bottom of each doc page. It strictly uses the sidebar that is displayed: if no sidebar is associated, no pagination is generated either.
You can customize pagination with front matter `pagination_next` and `pagination_prev`. Consider this sidebar:
```js title="sidebars.js"
module.exports = {
tutorial: [
'introduction',
{
installation: ['windows', 'linux', 'macos'],
},
'getting-started',
],
};
```
The pagination next link on "windows" points to "linux", but that doesn't make sense: you would want readers to proceed to "getting started" after installation. In this case, you can set the pagination manually:
```yml title="windows.md"
---
# highlight-next-line
pagination_next: getting-started
---
# Installation on Windows
```
You can also disable displaying a pagination link with `pagination_next: null` or `pagination_prev: null`.
The pagination label by default is the sidebar label. You can use the front matter `pagination_label` to customize how this doc appears in the pagination.
## Passing custom props {#passing-custom-props} ## Passing custom props {#passing-custom-props}
To pass in custom props to a swizzled sidebar item, add the optional `customProps` object to any of the items: To pass in custom props to a swizzled sidebar item, add the optional `customProps` object to any of the items:
@ -786,8 +1029,8 @@ To pass in custom props to a swizzled sidebar item, add the optional `customProp
id: 'doc1', id: 'doc1',
customProps: { customProps: {
/* props */ /* props */
} },
} };
``` ```
## Complex sidebars example {#complex-sidebars-example} ## Complex sidebars example {#complex-sidebars-example}
@ -802,7 +1045,7 @@ import CodeBlock from '@theme/CodeBlock';
.default .default
.split('\n') .split('\n')
// remove comments // remove comments
.map((line) => !['#','/*','*'].some(commentPattern => line.trim().startsWith(commentPattern)) && line) .map((line) => !['//','/*','*'].some(commentPattern => line.trim().startsWith(commentPattern)) && line)
.filter(Boolean) .filter(Boolean)
.join('\n')} .join('\n')}
</CodeBlock> </CodeBlock>

4
website/versioned_docs/version-2.0.0-beta.10/guides/docs/versioning.md → website/versioned_docs/version-2.0.0-beta.14/guides/docs/versioning.md
View file

@ -69,8 +69,8 @@ npm run docusaurus docs:version 1.1.0
When tagging a new version, the document versioning mechanism will: When tagging a new version, the document versioning mechanism will:
- Copy the full `docs/` folder contents into a new `versioned_docs/version-<version>/` folder. - Copy the full `docs/` folder contents into a new `versioned_docs/version-[versionName]/` folder.
- Create a versioned sidebars file based from your current [sidebar](docs-introduction.md#sidebar) configuration (if it exists) - saved as `versioned_sidebars/version-<version>-sidebars.json`. - Create a versioned sidebars file based from your current [sidebar](docs-introduction.md#sidebar) configuration (if it exists) - saved as `versioned_sidebars/version-[versionName]-sidebars.json`.
- Append the new version number to `versions.json`. - Append the new version number to `versions.json`.
## Docs {#docs} ## Docs {#docs}

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/_markdown-partial-example.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/_markdown-partial-example.mdx
View file

62
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-admonitions.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-admonitions.mdx
View file

@ -69,6 +69,28 @@ Some **content** with _markdown_ `syntax`. Check [this `api`](#).
::: :::
## Usage with Prettier {#usage-with-prettier}
If you use [Prettier](https://prettier.io) to format your Markdown files, Prettier might autoformat your code to invalid admonition syntax. To avoid this problem, add empty lines around the starting and ending directives. This is also why the examples we show here all have empty lines around the content.
<!-- prettier-ignore -->
```md
<!-- Prettier doesn't change this -->
::: note
Hello world
:::
<!-- Prettier changes this -->
::: note
Hello world
:::
<!-- to this -->
::: note Hello world:::
```
## Specifying title {#specifying-title} ## Specifying title {#specifying-title}
You may also specify an optional title You may also specify an optional title
@ -121,3 +143,43 @@ import TabItem from '@theme/TabItem';
``` ```
::: :::
## Usage in JSX
Outside of Markdown, you can use the `@theme/Admonitions` component to get the same output.
```jsx title="MyReactPage.jsx"
import Admonition from '@theme/Admonitions';
export default function MyReactPage() {
return (
<div>
<Admonition type="info">
<p>Some information</p>
</Admonition>
</div>
);
}
```
The types that are accepted are the same as above: `note`, `tip`, `danger`, `info`, `caution`. Optionally, you can specify an icon by passing a JSX element or a string, or a title:
```jsx title="MyReactPage.jsx"
<Admonition type="tip" icon="💡" title="Did you know...">
<p>
Use plugins to introduce shorter syntax for the most commonly used JSX
elements in your project.
</p>
</Admonition>
```
```mdx-code-block
import Admonition from '@theme/Admonition';
import BrowserWindow from '@site/src/components/BrowserWindow';
<BrowserWindow>
<Admonition type="tip" icon="💡" title="Did you know...">
<p>Use plugins to introduce shorter syntax for the most commonly used JSX elements in your project.</p>
</Admonition>
</BrowserWindow>
```

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-assets.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-assets.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-code-blocks.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-code-blocks.mdx
View file

6
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-head-metadata.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-head-metadata.mdx
View file

@ -52,6 +52,12 @@ Open your browser DevTools and check how this page's metadata have been affected
::: :::
:::tip
**You don't always need this for typical SEO needs.** Content plugins (e.g. docs and blog) provide front matter options like `description`, `keywords`, and `image`, which will be automatically applied to both `description` and `og:description`, while you would have to manually declare two metadata tags when using the `<head>` tag.
:::
:::note :::note
This feature is built on top of the Docusaurus [`<Head>`](./../../docusaurus-core.md#head) component. This feature is built on top of the Docusaurus [`<Head>`](./../../docusaurus-core.md#head) component.

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-headings.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-headings.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-inline-toc.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-inline-toc.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-intro.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-intro.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-math-equations.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-math-equations.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-plugins.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-plugins.mdx
View file

0
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-react.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-react.mdx
View file

27
website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-tabs-styles.module.css Normal file
View file

@ -0,0 +1,27 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.red {
color: red;
}
.red[aria-selected="true"] {
border-bottom-color: red;
}
.orange {
color: orange;
}
.orange[aria-selected="true"] {
border-bottom-color: orange;
}
.yellow {
color: yellow;
}
.yellow[aria-selected="true"] {
border-bottom-color: yellow;
}

79
website/versioned_docs/version-2.0.0-beta.10/guides/markdown-features/markdown-features-tabs.mdx → website/versioned_docs/version-2.0.0-beta.14/guides/markdown-features/markdown-features-tabs.mdx
View file

@ -9,6 +9,7 @@ slug: /markdown-features/tabs
import BrowserWindow from '@site/src/components/BrowserWindow'; import BrowserWindow from '@site/src/components/BrowserWindow';
import Tabs from '@theme/Tabs'; import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem'; import TabItem from '@theme/TabItem';
import styles from './markdown-features-tabs-styles.module.css';
``` ```
Docusaurus provides `<Tabs>` components that you can use thanks to [MDX](./markdown-features-react.mdx): Docusaurus provides `<Tabs>` components that you can use thanks to [MDX](./markdown-features-react.mdx):
@ -229,15 +230,12 @@ Tab choices with different `groupId`s will not interfere with each other:
You might want to customize the appearance of certain set of tabs. To do that you can pass the string in `className` prop and the specified CSS class will be added to the `Tabs` component: You might want to customize the appearance of certain set of tabs. To do that you can pass the string in `className` prop and the specified CSS class will be added to the `Tabs` component:
```jsx ```jsx
import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';
// highlight-next-line // highlight-next-line
<Tabs className="unique-tabs"> <Tabs className="unique-tabs">
<TabItem value="Apple">This is an apple 🍎</TabItem> <TabItem value="Apple">This is an apple 🍎</TabItem>
<TabItem value="Orange">This is an orange 🍊</TabItem> <TabItem value="Orange">This is an orange 🍊</TabItem>
<TabItem value="Banana">This is a banana 🍌</TabItem> <TabItem value="Banana">This is a banana 🍌</TabItem>
</Tabs>; </Tabs>
``` ```
```mdx-code-block ```mdx-code-block
@ -249,3 +247,76 @@ import TabItem from '@theme/TabItem';
</Tabs> </Tabs>
</BrowserWindow> </BrowserWindow>
``` ```
### Customizing tab headings
You can also customize each tab heading independently by using the `attributes` field. The extra props can be passed to the headings either through the `values` prop in `Tabs`, or props of each `TabItem`—in the same way as you declare `label`.
<!-- prettier-ignore-start -->
```jsx title="some-doc.mdx"
import styles from './styles.module.css';
<Tabs>
<TabItem value="apple" label="Apple" attributes={{className: styles.red}}>
This is an apple 🍎
</TabItem>
<TabItem value="orange" label="Orange" attributes={{className: styles.orange}}>
This is an orange 🍊
</TabItem>
<TabItem value="banana" label="Banana" attributes={{className: styles.yellow}}>
This is a banana 🍌
</TabItem>
</Tabs>
```
<!-- prettier-ignore-end -->
```css title="styles.module.css"
.red {
color: red;
}
.red[aria-selected='true'] {
border-bottom-color: red;
}
.orange {
color: orange;
}
.orange[aria-selected='true'] {
border-bottom-color: orange;
}
.yellow {
color: yellow;
}
.yellow[aria-selected='true'] {
border-bottom-color: yellow;
}
```
```mdx-code-block
<BrowserWindow>
<Tabs>
<TabItem value="apple" label="Apple" attributes={{className: styles.red}}>
This is an apple 🍎
</TabItem>
<TabItem value="orange" label="Orange" attributes={{className: styles.orange}}>
This is an orange 🍊
</TabItem>
<TabItem value="banana" label="Banana" attributes={{className: styles.yellow}}>
This is a banana 🍌
</TabItem>
</Tabs>
</BrowserWindow>
```
:::tip
`className` would be merged with other default class names. You may also use a custom `data-value` field (`{'data-value': 'apple'}`) paired with CSS attribute selectors:
```css title="styles.module.css"
li[role='tab'][data-value='apple'] {
color: red;
}
```
:::

4
website/versioned_docs/version-2.0.0-beta.10/i18n/i18n-crowdin.mdx → website/versioned_docs/version-2.0.0-beta.14/i18n/i18n-crowdin.mdx
View file

@ -37,7 +37,7 @@ We recommend the following translation workflow:
Crowdin provides a [CLI](https://support.crowdin.com/cli-tool/) to **upload sources** and **download translations**, allowing you to automate the translation process. Crowdin provides a [CLI](https://support.crowdin.com/cli-tool/) to **upload sources** and **download translations**, allowing you to automate the translation process.
The [`crowdin.yml` configuration file](https://support.crowdin.com/configuration-file/) is convenient for Docusaurus, and permits to **download the localized translation files at the expected location** (in `i18n/<locale>/..`). The [`crowdin.yml` configuration file](https://support.crowdin.com/configuration-file/) is convenient for Docusaurus, and permits to **download the localized translation files at the expected location** (in `i18n/[locale]/..`).
Read the **[official documentation](https://support.crowdin.com/)** to know more about advanced features and different translation workflows. Read the **[official documentation](https://support.crowdin.com/)** to know more about advanced features and different translation workflows.
@ -114,7 +114,7 @@ Your project is created, but it is empty for now. We will upload the files to tr
This configuration ([doc](https://support.crowdin.com/configuration-file/)) provides a mapping for the Crowdin CLI to understand: This configuration ([doc](https://support.crowdin.com/configuration-file/)) provides a mapping for the Crowdin CLI to understand:
- Where to find the source files to upload (JSON and Markdown) - Where to find the source files to upload (JSON and Markdown)
- Where to download the files after translation (in `i18n/<locale>`) - Where to download the files after translation (in `i18n/[locale]`)
Create `crowdin.yml` in `website`: Create `crowdin.yml` in `website`:

0
website/versioned_docs/version-2.0.0-beta.10/i18n/i18n-git.md → website/versioned_docs/version-2.0.0-beta.14/i18n/i18n-git.md
View file

4
website/versioned_docs/version-2.0.0-beta.10/i18n/i18n-introduction.md → website/versioned_docs/version-2.0.0-beta.14/i18n/i18n-introduction.md
View file

@ -92,12 +92,12 @@ The translation files should be created at the correct filesystem location.
Each locale and plugin has its own `i18n` subfolder: Each locale and plugin has its own `i18n` subfolder:
``` ```
website/i18n/<locale>/<pluginName>/... website/i18n/[locale]/[pluginName]/...
``` ```
:::note :::note
For multi-instance plugins, the path is `website/i18n/<locale>/<pluginName>-<pluginId>/...`. For multi-instance plugins, the path is `website/i18n/[locale]/[pluginName]-[pluginId]/...`.
::: :::

0
website/versioned_docs/version-2.0.0-beta.10/i18n/i18n-tutorial.md → website/versioned_docs/version-2.0.0-beta.14/i18n/i18n-tutorial.md
View file

0
website/versioned_docs/version-2.0.0-beta.10/installation.md → website/versioned_docs/version-2.0.0-beta.14/installation.md
View file

Some files were not shown because too many files have changed in this diff Show more