Skip to content

Commit a358637

Browse files
committed
docs: add stepped walkthrough for ESLint React setup guides
1 parent b9675cc commit a358637

File tree

2 files changed

+61
-6
lines changed

2 files changed

+61
-6
lines changed

apps/website/content/docs/getting-started/javascript.mdx

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ title: JavaScript
33
description: Getting started using ESLint React in your JavaScript React project
44
---
55

6+
import { Step, Steps } from "fumadocs-ui/components/steps";
7+
68
<Callout type="info" title="This instruction requires the following minimum versions:">
79

810
@@ -11,12 +13,20 @@ description: Getting started using ESLint React in your JavaScript React project
1113

1214
</Callout>
1315

16+
<Steps>
17+
18+
<Step>
19+
1420
## Installation
1521

1622
```package-install copy
1723
npm install --save-dev globals eslint @eslint/js @eslint-react/eslint-plugin
1824
```
1925

26+
</Step>
27+
28+
<Step>
29+
2030
## Configure ESLint
2131

2232
```js title="eslint.config.js"
@@ -58,7 +68,25 @@ export default defineConfig([
5868
]);
5969
```
6070

61-
## Resources
71+
</Step>
72+
73+
<Step>
74+
75+
## Configure JavaScript (Optional)
76+
77+
```jsonc title="jsconfig.json"
78+
{
79+
"compilerOptions": {
80+
// ...other options
81+
"allowJs": true,
82+
"jsx": "react-jsx",
83+
"jsxImportSource": "react",
84+
"noEmit": true,
85+
},
86+
"include": ["**/*.js", "**/*.jsx"]
87+
}
88+
```
89+
90+
</Step>
6291

63-
- [Configure ESLint](https://eslint.org/docs/latest/use/configure/)
64-
- [VS Code ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
92+
</Steps>

apps/website/content/docs/getting-started/typescript.mdx

Lines changed: 30 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ title: TypeScript
33
description: Getting started using ESLint React in your TypeScript React project
44
---
55

6+
import { Step, Steps } from "fumadocs-ui/components/steps";
7+
68
<Callout type="info" title="This instruction requires the following minimum versions:">
79

810
@@ -11,12 +13,20 @@ description: Getting started using ESLint React in your TypeScript React project
1113

1214
</Callout>
1315

16+
<Steps>
17+
18+
<Step>
19+
1420
## Installation
1521

1622
```package-install copy
1723
npm install --save-dev typescript-eslint @eslint-react/eslint-plugin
1824
```
1925

26+
</Step>
27+
28+
<Step>
29+
2030
## Configure ESLint
2131

2232
```js title="eslint.config.js"
@@ -55,7 +65,24 @@ export default tseslint.config({
5565
});
5666
```
5767

58-
## Resources
68+
</Step>
69+
70+
<Step>
71+
72+
## Configure TypeScript (Optional)
73+
74+
```jsonc title="tsconfig.json"
75+
{
76+
"compilerOptions": {
77+
// ...other options
78+
"jsx": "react-jsx",
79+
"jsxImportSource": "react",
80+
"noEmit": true,
81+
},
82+
"include": ["**/*.ts", "**/*.tsx"]
83+
}
84+
```
85+
86+
</Step>
5987

60-
- [Configure ESLint](https://eslint.org/docs/latest/use/configure/)
61-
- [VS Code ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
88+
</Steps>

0 commit comments

Comments
 (0)