Search code examples
eslintstorybook

eslint for storybook mdx

I am setting up storybook for a project using .mdx format and I would like to set up eslint so that I can check for things like spaces, alphabetical ordering and other things.

I have tried to set up this https://github.com/mdx-js/eslint-mdx and it seems that I have, but when I run eslint . --ext mdx, I get the following errors in one of my stories.mdx files:

enter image description here

Could someone please point me to a good resource to solving this or tell me what I am doing wrong?

Cheers

Solution

  • I found this issue on their github page that fixed the issue for me. Basically we use "overrides" in .eslintrc to assign the correct parser to mdx files, like so:

    {
  ...,
  overrides: [
    {
      files: '*.mdx',
      extends: 'plugin:mdx/recommended',
    },
  ],
}