Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Use babelrc config in stories.mdx files

See original GitHub issue

Describe the bug We use twin.macro in our stories.mdx file. Since Storybook 6.0 this macro no longer applies correctly. The reason for this seems to be that the stories.mdx loader in the webpack config disables babelrc. Why was this setting disabled, and is it safe to enable the babelrc config again?

Code snippets This is the (simplified) loader config for stories.mdx files:

{
  "test": "/(stories|story).mdx/",
  "use": [
    {
      "loader": "babel-loader/lib/index.js",
      "options": {
        "babelrc": false,
        "configFile": false
       }
    }
  ]
}

Additional context See related issue on the twin.macro repository.

Issue Analytics

State:
Created 3 years ago
Comments:11 (6 by maintainers)

Top GitHub Comments

1reaction

matthiskcommented, Aug 20, 2020

Yes that works, thanks!

0reactions

shilmancommented, Aug 25, 2020

¡Ay Caramba!! I just released https://github.com/storybookjs/storybook/releases/tag/v6.0.17 containing PR #12211 that references this issue. Upgrade today to try it out!

Top Results From Across the Web

Configure Storybook

Storybook is configured via a folder called .storybook , which contains various configuration files. Note that you can change the folder that Storybook...

storybook/addon-docs - npm

The configureJSX option is useful when you're writing your docs in MDX and your project's babel config isn't already set up to handle...

Getting started - MDX

This article explains how to integrate MDX into your project. It shows how to use MDX with your bundler and JSX runtime of...

Storybook mdx files are not displayed - Stack Overflow

I use default Storybook Webpack config alongside with data from my existed one. I don't see any *.mdx files in a stories side-bar....

Configuring Storybook: 6 Tips You Can't Miss | by Zheng Li

The configuration files are located in your project root fold ... js|mdx)'],// addons added to your storybook ... custom babel config