Installation

Install ESLint either locally or globally. (Note that locally, per project, is strongly preferred)

$ npm install eslint --save-dev

If you installed ESLint globally, you have to install React plugin globally too. Otherwise, install it locally.

$ npm install eslint-plugin-react-form-fields --save-dev

Configuration

Use our preset to get reasonable defaults:

  "extends": [
    "eslint:recommended",
    "plugin:react-form-fields/recommended"
  ]

If you do not use a preset you will need to specify individual rules and add extra configuration.

Add "react-form-fields" to the plugins section.

{
  "plugins": ["react-form-fields"]
}

Enable the rules that you would like to use.

  "rules": {
    "react-form-fields/no-mix-controlled-with-uncontrolled": "error",
    "react-form-fields/no-only-value-prop": "error"
  }

See also Configuring ESLint.

Rules

Possible Errors

| Rule ID | Description | | | :------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------- | :-: | | react-form-fields/no-mix-controlled-with-uncontrolled | Forbid to specify both value/checked and defaultValue/defaultChecked props to form fields | ⭐️ | | react-form-fields/no-only-value-prop | Forbid to specify only value/checked without onChange and readOnly props to form fields | ⭐️ | | react-form-fields/styled-no-mix-controlled-with-uncontrolled | Forbid to specify both value/checked and defaultValue/defaultChecked props to form fields | | | react-form-fields/styled-no-only-value-prop | Forbid to specify only value/checked without onChange and readOnly props to form fields | |

Semantic Versioning Policy

This plugin follows Semantic Versioning and ESLint's Semantic Versioning Policy.

Contributing

Welcome your contribution!

See also ESLint Contribution Guide.

Development Tools

• npm test runs tests.
• npm run update updates the package version. And it updates src/configs/recommended.ts, lib/index.ts, and README.md's rule table. See also npm version CLI command.
• npm run add-rule <RULE_ID> creates three files to add a new rule.

Contributors

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!

License

MIT © Kotaro Sugawara