Страница документации в MDX

Что делаем: пишем свою страницу документации — не для одного компонента, а для всего проекта.

MDX-файл как страница

Автодокументация хороша, пока нужен справочник по пропсам. Но «Введение», правила оформления или гайд по токенам не принадлежат ни одному компоненту. Для них пишут файл *.mdx рядом с историями. Он попадает в Storybook потому, что шаблон поиска в .storybook/main.ts (stories) берёт и mdx, и stories.tsx.

Компонент Meta из @storybook/addon-docs/blocks говорит, где страница стоит в боковой панели. Название с косой чертой делит дерево на раздел и страницу:

 
<Meta title="Руководство/Введение" />

Всё остальное — обычный Markdown: заголовки, абзацы, списки.

Попробуйте

Найдите в боковой панели раздел Руководство, откройте «Введение» и допишите ещё один абзац. Чтобы страница встала выше остальных, сделайте раздел первым в storySort — об этом можно прочитать в документации Storybook.