Skip to content

Commit

Permalink
docs: mention config/sidebars run in Node.js runtime (#10608)
Browse files Browse the repository at this point in the history
  • Loading branch information
slorber authored Oct 23, 2024
1 parent 1a2b8b7 commit 35aa39b
Show file tree
Hide file tree
Showing 7 changed files with 22 additions and 8 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@ import {themes as prismThemes} from 'prism-react-renderer';
import type {Config} from '@docusaurus/types';
import type * as Preset from '@docusaurus/preset-classic';

// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)

const config: Config = {
title: 'My Site',
tagline: 'Dinosaurs are cool',
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import type {SidebarsConfig} from '@docusaurus/plugin-content-docs';

// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)

/**
* Creating a sidebar enables you to:
- create an ordered group of docs
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@

import {themes as prismThemes} from 'prism-react-renderer';

// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)

/** @type {import('@docusaurus/types').Config} */
const config = {
title: 'My Site',
Expand Down
10 changes: 6 additions & 4 deletions packages/create-docusaurus/templates/classic/sidebars.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
// @ts-check

// This runs in Node.js - Don't use client-side code here (browser APIs, JSX...)

/**
* Creating a sidebar enables you to:
- create an ordered group of docs
Expand All @@ -7,11 +11,9 @@
The sidebars can be generated from the filesystem, or explicitly defined here.
Create as many sidebars as you want.
*/
// @ts-check

/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
@type {import('@docusaurus/plugin-content-docs').SidebarsConfig}
*/
const sidebars = {
// By default, Docusaurus generates a sidebar from the docs folder structure
tutorialSidebar: [{type: 'autogenerated', dirName: '.'}],
Expand Down
2 changes: 1 addition & 1 deletion website/docs/api/docusaurus.config.js.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ With a [TypeScript](../typescript-support.mdx) Docusaurus codebase your config f

:::

This file is run in Node.js and should export a site configuration object, or a function that creates it.
This file is **run in Node.js** and should export a site configuration object, or a function that creates it.

The `docusaurus.config.js` file supports:

Expand Down
2 changes: 1 addition & 1 deletion website/docs/api/plugins/plugin-content-docs.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ Accepted fields:
| `tagsBasePath` | `string` | `'tags'` | URL route for the tags list page of your site. It is prepended to the `routeBasePath`. |
| `include` | `string[]` | `['**/*.{md,mdx}']` | Array of glob patterns matching Markdown files to be built, relative to the content path. |
| `exclude` | `string[]` | _See example configuration_ | Array of glob patterns matching Markdown files to be excluded. Serves as refinement based on the `include` option. |
| `sidebarPath` | <code>false \| string</code> | `undefined` | Path to sidebar configuration. Use `false` to disable sidebars, or `undefined` to create a fully autogenerated sidebar. |
| `sidebarPath` | <code>false \| string</code> | `undefined` | Path to a sidebars configuration file, loaded in a Node.js context. Use `false` to disable sidebars, or `undefined` to create a fully autogenerated sidebar. |
| `sidebarCollapsible` | `boolean` | `true` | Whether sidebar categories are collapsible by default. See also [Collapsible categories](/docs/sidebar/items#collapsible-categories) |
| `sidebarCollapsed` | `boolean` | `true` | Whether sidebar categories are collapsed by default. See also [Expanded categories by default](/docs/sidebar/items#expanded-categories-by-default) |
| `sidebarItemsGenerator` | <code>[SidebarGenerator](#SidebarGenerator)</code> | _Omitted_ | Function used to replace the sidebar items of type `'autogenerated'` with real sidebar items (docs, categories, links...). See also [Customize the sidebar items generator](/docs/sidebar/autogenerated#customize-the-sidebar-items-generator) |
Expand Down
10 changes: 8 additions & 2 deletions website/docs/guides/docs/sidebar/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ Creating a sidebar is useful to:

To use sidebars on your Docusaurus site:

1. Define a file that exports a dictionary of [sidebar objects](#sidebar-object).
2. Pass this object into the `@docusaurus/plugin-docs` plugin directly or via `@docusaurus/preset-classic`.
1. Define a sidebars file that exports a dictionary of [sidebar objects](#sidebar-object).
2. Pass its path to the `@docusaurus/plugin-docs` plugin directly or via `@docusaurus/preset-classic`.

```js title="docusaurus.config.js"
export default {
Expand All @@ -31,6 +31,12 @@ export default {
};
```

:::important Node.js runtime

The sidebars file is run with Node.js. You can't use or import browsers APIs, React or JSX in it.

:::

This section serves as an overview of miscellaneous features of the doc sidebar. In the following sections, we will more systematically introduce the following concepts:

```mdx-code-block
Expand Down

0 comments on commit 35aa39b

Please sign in to comment.