Support MDXv2 #377
Support MDXv2 #377
Conversation
| @@ -68,6 +68,7 @@ const INCLUDE_CANDIDATES = [ | |||
| 'react-is', | |||
| 'react-textarea-autosize', | |||
| 'react', | |||
| 'react/jsx-runtime', | |||
There was a problem hiding this comment.
MDX2 needed this
packages/builder-vite/mdx-plugin.ts
Outdated
| async transform(code, id, ssr) { | ||
| if (id.endsWith('.mdx')) { | ||
| // @ts-ignore | ||
| const { compile } = await import('@storybook/mdx2-csf'); |
There was a problem hiding this comment.
Since the "main" file is used the types don't match
joshwooding
force-pushed
the
support-mdx2
branch
2 times, most recently
from
6ad5773
to
0c40e47
Compare
joshwooding
force-pushed
the
support-mdx2
branch
from
0c40e47
to
b663ded
Compare
joshwooding
force-pushed
the
support-mdx2
branch
from
b663ded
to
db210ab
Compare
There was a problem hiding this comment.
This is great. I tested out preact with both mdx1 and 2, and both worked. I also doublechecked that transclusion of other mdx files into mdx stories is working.
I pushed up a few small changes:
- Fixed prettier formatting that was failing in CI
- Removed the explicit mdx dependency from preact
- Added
@storybook/mdx2-csfto the examples using it, to avoid confusion if anyone else uses those as a guide. - Removed the force-install workarounds from the readme, since those are no longer needed. \o/
| noFouc(), | ||
| injectExportOrderPlugin, | ||
| // We need the react plugin here to support MDX. |
There was a problem hiding this comment.
@joshwooding @IanVS Sorry for bothering, but i just found an inevitable exception when i start my vue3 project without using any mdx file with @storybook/builer-vite@1.0.38 or laster.
the web page crashed due to this problem, which was fixed by adding some lines in main.js:
async viteFinal(config) {
// ignore react plugins
config.plugins = config.plugins.flat().filter(p => !p.name.includes('react'))
return config
}i didn't use any mdx features. but I need to ignore the react plugins, which made me confused.
Fixes #234
Fixes #391
Fixes #398
To enable experimental MDX2 in a project, follow this guide: https://gist.github.com/shilman/6ff2d7e18db8846e8fc552fb432ae4f6