mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-05 12:22:45 +02:00
Co-authored-by: Joshua Chen <sidachen2003@gmail.com> Co-authored-by: sebastienlorber <lorber.sebastien@gmail.com> Co-authored-by: Sébastien Lorber <slorber@users.noreply.github.com> Co-authored-by: Ivan Mar (sOkam!) <7308253+heysokam@users.noreply.github.com> Co-authored-by: c0h1b4 <dwidman@gmail.com> Co-authored-by: Janessa Garrow <janessa.garrow@gmail.com> Co-authored-by: ozaki <29860391+OzakIOne@users.noreply.github.com> Co-authored-by: axmmisaka <6500159+axmmisaka@users.noreply.github.com> Co-authored-by: Tatsunori Uchino <tats.u@live.jp> Co-authored-by: Simen Bekkhus <sbekkhus91@gmail.com> fix(i18n): complete translations for theme-common.json Brazilian Portuguese (pt-BR) (#9477) fix(content-blog): add baseUrl for author.image_url (#9581) fix(type-aliases): add `title` prop for imported inline SVG React components (#9612) fix(utils): Markdown link replacement with <> but no spaces (#9617) fix(live-codeblock): stabilize react-live transformCode callback, fix editor/preview desync (#9631) fix(cli): output help when no conventional config + no subcommand (#9648) fix CI job (#9604) fix Lint Autofix workflow (#9632) fix(pwa-plugin): upgrade workbox (#9668) fix(create-docusaurus): fix init template code blocks, and little improvements (#9696) fix(theme): allow empty code blocks and live playgrounds (#9704) |
||
---|---|---|
.. | ||
src | ||
.npmignore | ||
example.png | ||
package.json | ||
README.md | ||
tsconfig.json |
Remark plugin npm2yarn
Motivation:
Transforms npm bash command code blocks to Docusaurus tabs:
The following (remove the //
):
// ```bash npm2yarn
// npm run build
// ```
Becomes:
Note: it only works when used with Docusaurus themes that have the Tabs
and TabItems
components.
Install
npm install @docusaurus/remark-plugin-npm2yarn
It is a Remark plugin, not a Docusaurus plugin, so you have to install it as a Remark plugin in the config of your Docusaurus plugins.
module.exports = {
presets: [
[
'@docusaurus/preset-classic',
{
docs: {
// ...
remarkPlugins: [
[require('@docusaurus/remark-plugin-npm2yarn'), {sync: true}],
],
},
blog: {
// ...
remarkPlugins: [
[require('@docusaurus/remark-plugin-npm2yarn'), {sync: true}],
],
},
pages: {
// ...
remarkPlugins: [
[require('@docusaurus/remark-plugin-npm2yarn'), {sync: true}],
],
},
// ...
},
],
],
// ...
};
Options
Property | Type | Default | Description |
---|---|---|---|
sync |
boolean |
false |
Syncing tab choices (Yarn and npm). See https://docusaurus.io/docs/markdown-features/#syncing-tab-choices for details. |
converters |
array |
'yarn' , 'pnpm' |
The list of converters to use. The order of the converters is important, as the first converter will be used as the default choice. |
Custom converters
In case you want to convert npm commands to something else than yarn
or pnpm
, you can use custom converters:
type CustomConverter = [name: string, cb: (npmCode: string) => string];
{
remarkPlugins: [
[
require('@docusaurus/remark-plugin-npm2yarn'),
{
sync: true,
converters: [
'yarn',
'pnpm',
['Turbo', (code) => code.replace(/npm/g, 'turbo')],
],
},
],
];
}