8000 docs: add flat config example, close #230 · Luckeu/typescript-eslint@de02f00 · GitHub
[go: up one dir, main page]

Skip to content

Commit de02f00

Browse files
committed
docs: add flat config example, close typescript-eslint#230
1 parent b4bd682 commit de02f00

File tree

4 files changed

+93
-5
lines changed

4 files changed

+93
-5
lines changed

docs/packages/default.md

Lines changed: 22 additions & 1 deletion
< 8000 td data-grid-cell-id="diff-fbd912a164892da8e9af311a829d4e6fe6dc7c8d346d7b8e2de08d7b6aadb34e-26-36-0" data-selected="false" role="gridcell" style="background-color:var(--diffBlob-additionNum-bgColor, var(--diffBlob-addition-bgColor-num));text-align:center" tabindex="-1" valign="top" class="focusable-grid-cell diff-line-number position-relative left-side">
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,27 @@ npm i -D @stylistic/eslint-plugin
2222
```
2323

2424
Add `@stylistic` to your plugins list, and prefix [stylistic rules](#rules) with `@stylistic`:
25+
::: code-group
2526

26-
```js
27+
```js [Flat Config]
28+
// eslint.config.js
29+
import stylistic from '@stylistic/eslint-plugin' // [!code ++]
30+
31+
export default [
32+
{
33+
plugins: {
34+
'@stylistic': stylistic // [!code ++]
35+
},
36+
rules: {
37+
'indent': ['error', 2], // [!code --]
38+
'@stylistic/indent': ['error', 2], // [!code ++]
39+
// ...
40+
}
41+
}
42+
]
43+
```
44+
45+
```js [Legacy Config]
2746
// .eslintrc.js
2847
module.exports = {
2948
plugins: [
@@ -37,6 +56,8 @@ module.exports = {
3756
}
3857
```
3958

59+
:::
60+
4061
Check out the [migration guide](/guide/migration) for more details.
4162

4263
## Rules

docs/packages/js.md

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,27 @@ npm i -D @stylistic/eslint-plugin-js
1616

1717
Add `@stylistic/js` to your plugins list, and prefix [stylistic rules](#rules) with `@stylistic/js`:
1818

19-
```js
19+
::: code-group
20+
21+
```js [Flat Config]
22+
// eslint.config.js
23+
import stylisticJs from '@stylistic/eslint-plugin-js' // [!code ++]
24+
25+
export default [
26+
{
27+
plugins: {
28+
'@stylistic/js': stylisticJs // [!code ++]
29+
},
30+
rules: {
31+
'indent': ['error', 2], // [!code --]
32+
'@stylistic/js/indent': ['error', 2], // [!code ++]
33+
// ...
34+
}
35+
}
36+
]
37+
```
38+
39+
```js [Legacy Config]
2040
// .eslintrc.js
2141
module.exports = {
2242
plugins: [
@@ -30,6 +50,8 @@ module.exports = {
3050
}
3151
```
3252

53+
:::
54+
3355
Check out the [migration guide](/guide/migration) for more details.
3456

3557
## Rules

docs/packages/jsx.md

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,27 @@ npm i -D @stylistic/eslint-plugin-jsx
1616

1717
Add `@stylistic/jsx` to your plugins list, and change the prefix for [stylistic rules](#rules) from `react` to `@stylistic/js`:
1818

19-
```ts
19+
::: code-group
20+
21+
```js [Flat Config]
22+
// eslint.config.js
23+
import stylisticJsx from '@stylistic/eslint-plugin-jsx' // [!code ++]
24+
25+
export default [
26+
{
27+
plugins: {
28+
'@stylistic/jsx': stylisticJsx // [!code ++]
29+
},
30+
rules: {
31+
'react/jsx-indent': ['error', 2], // [!code --]
32+
'@stylistic/jsx/jsx-indent': ['error', 2], // [!code ++]
33+
// ...
34+
}
35+
}
36+
]
37+
```
38+
39+
```js [Legacy Config]
2040
// .eslintrc.js
2141
module.exports = {
2242
plugins: [
@@ -27,9 +47,11 @@ module.exports = {
2747
'@stylistic/jsx/jsx-indent': ['error', 2], // [!code ++]
2848
// ...
2949
}
30-
};
50+
}
3151
```
3252

53+
:::
54+
3355
Check out the [migration guide](/guide/migration) for more details.
3456

3557
## Rules

docs/packages/ts.md

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,29 @@ npm i -D @stylistic/eslint-plugin-ts
1515
```
1616

1717
Add `@stylistic/ts` to your plugins list, and change the prefix for [stylistic rules](#rules) from `@typescript-eslint/` to `@stylistic/ts/`:
18+
::: code-group
1819

19-
```js
20+
```js [Flat Config]
21+
// eslint.config.js
22+
import stylisticTs from '@stylistic/eslint-plugin-ts' // [!code ++]
23+
import parserTs from '@typescript-eslint/parser'
24+
25+
export default [
26+
{
27+
plugins: {
28+
'@stylistic/ts': stylisticTs // [!code ++]
29+
},
30+
parser: parserTs,
31+
rules: {
32+
'@typescript-eslint/indent': ['error', 2], // [!code --]
33+
'@stylistic/ts/indent': ['error', 2], // [!code ++]
34+
// ...
35+
}
36+
}
37+
]
38+
```
39+
40+
```js [Legacy Config]
2041
// .eslintrc.js
2142
module.exports = {
2243
plugins: [
@@ -32,6 +53,8 @@ module.exports = {
3253
};
3354
```
3455

56+
:::
57+
3558
Note that this package only contains stylistic rules. You still need to install `@typescript-eslint/parser` and `@typescript-eslint/eslint-plugin` to parse and lint your TypeScript code.
3659

3760
Check out the [migration guide](/guide/migration) for more details.

0 commit comments

Comments
 (0)
0