1 | # `eslint-plugin-react-hooks`
|
2 |
|
3 | This ESLint plugin enforces the [Rules of Hooks](https://react.dev/reference/rules/rules-of-hooks).
|
4 |
|
5 | It is a part of the [Hooks API](https://react.dev/reference/react/hooks) for React.
|
6 |
|
7 | ## Installation
|
8 |
|
9 | **Note: If you're using Create React App, please use `react-scripts` >= 3 instead of adding it directly.**
|
10 |
|
11 | Assuming you already have ESLint installed, run:
|
12 |
|
13 | ```sh
|
14 | # npm
|
15 | npm install eslint-plugin-react-hooks --save-dev
|
16 |
|
17 | # yarn
|
18 | yarn add eslint-plugin-react-hooks --dev
|
19 | ```
|
20 |
|
21 | Then extend the recommended eslint config:
|
22 |
|
23 | ```js
|
24 | {
|
25 | "extends": [
|
26 | // ...
|
27 | "plugin:react-hooks/recommended"
|
28 | ]
|
29 | }
|
30 | ```
|
31 |
|
32 | ### Custom Configuration
|
33 |
|
34 | If you want more fine-grained configuration, you can instead add a snippet like this to your ESLint configuration file:
|
35 |
|
36 | ```js
|
37 | {
|
38 | "plugins": [
|
39 | // ...
|
40 | "react-hooks"
|
41 | ],
|
42 | "rules": {
|
43 | // ...
|
44 | "react-hooks/rules-of-hooks": "error",
|
45 | "react-hooks/exhaustive-deps": "warn"
|
46 | }
|
47 | }
|
48 | ```
|
49 |
|
50 |
|
51 | ## Advanced Configuration
|
52 |
|
53 | `exhaustive-deps` can be configured to validate dependencies of custom Hooks with the `additionalHooks` option.
|
54 | This option accepts a regex to match the names of custom Hooks that have dependencies.
|
55 |
|
56 | ```js
|
57 | {
|
58 | "rules": {
|
59 | // ...
|
60 | "react-hooks/exhaustive-deps": ["warn", {
|
61 | "additionalHooks": "(useMyCustomHook|useMyOtherCustomHook)"
|
62 | }]
|
63 | }
|
64 | }
|
65 | ```
|
66 |
|
67 | We suggest to use this option **very sparingly, if at all**. Generally saying, we recommend most custom Hooks to not use the dependencies argument, and instead provide a higher-level API that is more focused around a specific use case.
|
68 |
|
69 | ## Valid and Invalid Examples
|
70 |
|
71 | Please refer to the [Rules of Hooks](https://react.dev/reference/rules/rules-of-hooks) documentation to learn more about this rule.
|
72 |
|
73 | ## License
|
74 |
|
75 | MIT
|