Ask questionsMDX error: Support for the experimental syntax 'jsx' isn't currently enabled

A recent change in babel has broken Storybook's MDX configuration in CRA, with the error: Support for the experimental syntax 'jsx' isn't currently enabled.

More info here:

This is reproducible in a fresh CRA install, and the problem is present on both next and latest branches, unrelated to any code changes on our side.

cc @tooppaaa @ndelangen


Answer questions shilman

There are two workarounds for this issue. For React projects (e.g. CRA) that have the following line in their main.js:

module.exports = {
  addons: [

Update to:

module.exports = {
  addons: [
       name: '@storybook/addon-docs',
       options: { configureJSX: true }

If you use <>blah</> style fragments in your MDX, this will unlock a second bug (presumably from the same underlying source): transform-react-jsx: pragma has been set but pragmaFrag has not been set.

For now, the workaround is to rewrite those fragments as <React.Fragment>blah</React.Fragment>.

We're working on:

  1. A better workaround for the fragment issue
  2. A proper fix to both issues
Github User Rank List