0.3.0 • Published 3 years ago
eslint-plugin-react-hook-form v0.3.0
eslint-plugin-react-hook-form
react-hook-form is an awsome library which provide a neat solution for building forms. However, there are many rules for the API which may be missed by the developer. This plugin aims to check those rules automatically thourgh ESLint. Thus brings better DX for react-hook-form.
Installation
You'll first need to install ESLint:
$ npm i eslint --save-devNext, install eslint-plugin-react-hook-form:
$ npm install eslint-plugin-react-hook-form --save-devUsage
Add react-hook-form to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:
{
"plugins": ["react-hook-form"]
}Then configure the rules you want to use under the rules section.
{
"rules": {
"react-hook-form/destructuring-formstate": "error"
}
}or start with the recommended rule set:
{
"extends": "plugin:react-hook-form/recommended"
}Supported Rules
| Rule | Description | Recommended | Fixable |
|---|---|---|---|
| destructuring-formstate | Use destructuring assignment to access the properties of formState. | ⛔️ | |
| no-access-control | Avoid accessing the properties of control | ⛔️ | |
| no-nested-object-setvalue | Avoid nested object in second argument of setValue | ⛔️ | 🔧 |
Key
| Icon | Description |
|---|---|
| ⛔️ | Reports as error in recommended configuration |
| ⚠️ | Reports as warning in recommended configuration |
| 🔧 | Rule is fixable with eslint --fix |