mdx-js / eslint-mdx

ESLint Parser/Plugin for MDX
https://npmjs.org/eslint-plugin-mdx
MIT License
264 stars 30 forks source link

Unable to lint MDX components in `2.0.0-next.2` #391

Closed dimaMachina closed 2 years ago

dimaMachina commented 2 years ago

Initial checklist

Affected packages and versions

2.0.0-next.2

Link to runnable example

No response

Steps to reproduce

module.exports = {
  overrides: [
    {
      files: '*.md{,x}',
      parser: 'eslint-mdx',
      processor: 'mdx/remark',
      plugins: ['mdx'],
      settings: {
        'mdx/code-blocks': true
      }
    },
    {
      files: ['*.md{,x}', '*.{j,t}s{,x}'],
      extends: 'plugin:react/recommended'
    }
  ]
}
# Hello world

\```js
<Foo />
\```

<Foo />

\```jsx
<Foo />
\```

Expected behavior

/Users/dimitri/Desktop/mdx-repro/test.mdx
   7:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
   7:2  error  'Foo' is not defined                     react/jsx-no-undef
   4:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
   4:2  error  'Foo' is not defined                     react/jsx-no-undef
  10:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
  10:2  error  'Foo' is not defined                     react/jsx-no-undef

✖ 6 problems (6 errors, 0 warnings)

Actual behavior

   4:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
   4:2  error  'Foo' is not defined                     react/jsx-no-undef
  10:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
  10:2  error  'Foo' is not defined                     react/jsx-no-undef

✖ 4 problems (4 errors, 0 warnings)

Runtime

No response

Package manager

No response

OS

No response

Build and bundle tools

No response

JounQin commented 2 years ago

Should be related to https://github.com/mdx-js/eslint-mdx/issues/384#issuecomment-1110737802, waiting for micromark/micromark-extension-mdx-expression#4.

cc @wooorm

wooorm commented 2 years ago

micromark is released!

JounQin commented 2 years ago

I created #393 to make sure, after upgrading micromark-util-events-to-acorn, it works as expected.

@B2o5T Please upgrade it by yourself by deleting yarn.lock, etc.

dimaMachina commented 2 years ago

@JounQin upgraded but the issue was not solved even on the latest micromark-util-events-to-acorn@1.1.0

info from yarn.lock

micromark-util-events-to-acorn@^1.0.0:
  version "1.1.0"
  resolved "https://registry.yarnpkg.com/micromark-util-events-to-acorn/-/micromark-util-events-to-acorn-1.1.0.tgz#9891638e201c266484d0af7cd2505d208f73db9d"
  integrity sha512-hB8HzidNt/Us5q2BvqXj8eeEm0U9rRfnZxcA9T65JRUMAY4MbfJRAFm7m9fXMAdSHJiVPmajsp8/rp6/FlHL8A==
  dependencies:
    "@types/acorn" "^4.0.0"
    "@types/estree" "^0.0.51"
    estree-util-visit "^1.0.0"
    micromark-util-types "^1.0.0"
    uvu "^0.5.0"
    vfile-location "^4.0.0"
    vfile-message "^3.0.0"
JounQin commented 2 years ago

Can you please provide a runnable reproduction?

JounQin commented 2 years ago

Oh, should also be related to https://github.com/mdx-js/eslint-mdx/issues/384#issuecomment-1123625050

The jsx tokens are not available for now.

JounQin commented 2 years ago

@B2o5T Besides, the two rules are disabled for mdx content in the recommended config at https://github.com/mdx-js/eslint-mdx/blob/master/packages/eslint-plugin-mdx/src/configs/overrides.ts#L23-L35, that's why I can't reproduce it at #393

Of course, the missing tokens are still a problem, but that would be another issue, so close this one for now.


Edit, Just notice you didn't use plugin:mdx/recommended at all.

JounQin commented 2 years ago

Close because duplicate of #384

JounQin commented 2 years ago

@B2o5T

Please try:

# yarn 1
yarn add https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-mdx https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-plugin-mdx
# yarn 2, 3
yarn add eslint-mdx@https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-mdx/_pkg.tgz eslint-plugin-mdx@https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-plugin-mdx/_pkg.tgz
# npm
npm i https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-mdx https://pkg.csb.dev/mdx-js/eslint-mdx/commit/cc2cd6c2/eslint-plugin-mdx

It should just work now:

https://github.com/mdx-js/eslint-mdx/pull/394/files#diff-7dc63d54389fc5b805a5cebe74578027e4837d2eb08085555c7792fad8da8552R397

dimaMachina commented 2 years ago

@JounQin Thank you! it's works 😍

/Users/dimitri/Desktop/mdx-repro/test.mdx
   4:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
   4:2  error  'Foo' is not defined                     react/jsx-no-undef
   7:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
   7:2  error  'Foo' is not defined                     react/jsx-no-undef
  10:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope
  10:2  error  'Foo' is not defined                     react/jsx-no-undef

✖ 6 problems (6 errors, 0 warnings)