Skip to content

Commit 2672044

Browse files
JounQinJounQin
authored
feat: support mdx comments as ESLint directives (#564)
close #534
1 parent 3aa0f20 commit 2672044

File tree

15 files changed

+970
-791
lines changed

15 files changed

+970
-791
lines changed

‎.changeset/nasty-bananas-sleep.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"eslint-plugin-mdx": minor
3+
---
4+
5+
feat: support mdx comments as ESLint directives

‎README.md

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
- [Install](#install)
3333
- [Notice](#notice)
3434
- [Usage](#usage)
35-
- [Classic](#classic)
35+
- [Classic Config](#classic-config)
3636
- [Flat Config](#flat-config)
3737
- [Parser Options](#parser-options)
3838
- [Parser API](#parser-api)
@@ -74,13 +74,25 @@ npm i -D eslint-plugin-mdx
7474

7575
## Notice
7676

77-
If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) feature of ESLint, because configs may be overridden by following configs.
77+
1. If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) ([Classic Config](#classic-config)) or [`files`](https://eslint.org/docs/latest/use/configure/configuration-files#specifying-files-and-ignores) ([Flag Config](#flat-config)) feature of ESLint, because configs may be overridden by following configs.
7878

79-
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
79+
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
80+
81+
2. If you're using `{/* eslint-disable-line mdx/remark */}` with `prettier`, this won't work because `prettier` will add a blank line after the comment, which makes it invalid. You can use `{/* eslint-disable mdx/remark */}` paired with `{/* eslint-enable mdx/remark */}` instead:
82+
83+
<!-- eslint-skip -->
84+
85+
```mdx
86+
{/* eslint-disable mdx/remark */}
87+
88+
# Heading
89+
90+
{/* eslint-enable mdx/remark */}
91+
```
8092

8193
## Usage
8294

83-
### Classic
95+
### Classic Config
8496

8597
`.eslintrc` file:
8698

‎packages/eslint-mdx/README.md

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
- [Install](#install)
3333
- [Notice](#notice)
3434
- [Usage](#usage)
35-
- [Classic](#classic)
35+
- [Classic Config](#classic-config)
3636
- [Flat Config](#flat-config)
3737
- [Parser Options](#parser-options)
3838
- [Parser API](#parser-api)
@@ -74,13 +74,25 @@ npm i -D eslint-plugin-mdx
7474

7575
## Notice
7676

77-
If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) feature of ESLint, because configs may be overridden by following configs.
77+
1. If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) ([Classic Config](#classic-config)) or [`files`](https://eslint.org/docs/latest/use/configure/configuration-files#specifying-files-and-ignores) ([Flag Config](#flat-config)) feature of ESLint, because configs may be overridden by following configs.
7878

79-
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
79+
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
80+
81+
2. If you're using `{/* eslint-disable-line mdx/remark */}` with `prettier`, this won't work because `prettier` will add a blank line after the comment, which makes it invalid. You can use `{/* eslint-disable mdx/remark */}` paired with `{/* eslint-enable mdx/remark */}` instead:
82+
83+
<!-- eslint-skip -->
84+
85+
```mdx
86+
{/* eslint-disable mdx/remark */}
87+
88+
# Heading
89+
90+
{/* eslint-enable mdx/remark */}
91+
```
8092

8193
## Usage
8294

83-
### Classic
95+
### Classic Config
8496

8597
`.eslintrc` file:
8698

‎packages/eslint-plugin-mdx/README.md

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
- [Install](#install)
3333
- [Notice](#notice)
3434
- [Usage](#usage)
35-
- [Classic](#classic)
35+
- [Classic Config](#classic-config)
3636
- [Flat Config](#flat-config)
3737
- [Parser Options](#parser-options)
3838
- [Parser API](#parser-api)
@@ -74,13 +74,25 @@ npm i -D eslint-plugin-mdx
7474

7575
## Notice
7676

77-
If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) feature of ESLint, because configs may be overridden by following configs.
77+
1. If you're using multi languages, `js/jsx/ts/tsx/vue`, etc for example, you'd better to always use [`overrides`](https://eslint.org/docs/user-guide/configuring/configuration-files#how-do-overrides-work) ([Classic Config](#classic-config)) or [`files`](https://eslint.org/docs/latest/use/configure/configuration-files#specifying-files-and-ignores) ([Flag Config](#flat-config)) feature of ESLint, because configs may be overridden by following configs.
7878

79-
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
79+
See [#251](https://github.com/mdx-js/eslint-mdx/issues/251#issuecomment-736139224) for more details.
80+
81+
2. If you're using `{/* eslint-disable-line mdx/remark */}` with `prettier`, this won't work because `prettier` will add a blank line after the comment, which makes it invalid. You can use `{/* eslint-disable mdx/remark */}` paired with `{/* eslint-enable mdx/remark */}` instead:
82+
83+
<!-- eslint-skip -->
84+
85+
```mdx
86+
{/* eslint-disable mdx/remark */}
87+
88+
# Heading
89+
90+
{/* eslint-enable mdx/remark */}
91+
```
8092

8193
## Usage
8294

83-
### Classic
95+
### Classic Config
8496

8597
`.eslintrc` file:
8698

‎packages/eslint-plugin-mdx/package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,8 @@
5151
"dependencies": {
5252
"eslint-mdx": "^3.3.2",
5353
"mdast-util-from-markdown": "^2.0.2",
54+
"mdast-util-mdx": "^3.0.0",
55+
"micromark-extension-mdxjs": "^3.0.0",
5456
"remark-mdx": "^3.1.0",
5557
"remark-parse": "^11.0.0",
5658
"remark-stringify": "^11.0.0",

‎packages/eslint-plugin-mdx/src/from-markdown.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
import type { fromMarkdown as fromMarkdown_ } from 'mdast-util-from-markdown'
1+
import type { Root } from 'mdast'
2+
import type { Value } from 'mdast-util-from-markdown'
23
import { createSyncFn } from 'synckit'
34

45
import { cjsRequire } from './helpers.js'
56

6-
export const fromMarkdown = createSyncFn<typeof fromMarkdown_>(
7-
cjsRequire.resolve('./worker.js'),
8-
)
7+
export const fromMarkdown = createSyncFn<
8+
(value: Value, isMdx: boolean) => Root
9+
>(cjsRequire.resolve('./worker.js'))

‎packages/eslint-plugin-mdx/src/processors/helpers.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
export const DEFAULT_LANGUAGE_MAPPER: Record<string, string> = {
2+
ecmascript: 'js',
23
javascript: 'js',
34
javascriptreact: 'jsx',
45
typescript: 'ts',

0 commit comments

Comments
 (0)