ESLint-plugin-React
![Code Climate](https://img.shields.io/codeclimate/github/yannickcr/eslint-plugin-react.svg)
React specific linting rules for ESLint
Installation
Install ESLint either locally or globally.
$ 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 --save-dev
Configuration
Use our preset to get reasonable defaults:
"extends": [
"eslint:recommended",
"plugin:react/recommended"
]
You should also specify settings that will be shared across all the plugin rules.
{
"settings": {
"react": {
"createClass": "createReactClass", // Regex for Component Factory to use,
// default to "createReactClass"
"pragma": "React", // Pragma to use, default to "React"
"version": "15.0", // React version, default to the latest React stable release
"flowVersion": "0.53" // Flow version
},
"propWrapperFunctions": [ "forbidExtraProps" ] // The names of any functions used to wrap the
// propTypes object, e.g. `forbidExtraProps`.
// If this isn't set, any propTypes wrapped in
// a function will be skipped.
}
}
If you do not use a preset you will need to specify individual rules and add extra configuration.
Add "react" to the plugins section.
{
"plugins": [
"react"
]
}
Enable JSX support.
With ESLint 2+
{
"parserOptions": {
"ecmaFeatures": {
"jsx": true
}
}
}
Enable the rules that you would like to use.
"rules": {
"react/jsx-uses-react": "error",
"react/jsx-uses-vars": "error",
}
List of supported rules
JSX-specific rules
Other useful plugins
Shareable configurations
Recommended
This plugin exports a recommended
configuration that enforces React good practices.
To enable this configuration use the extends
property in your .eslintrc
config file:
{
"extends": ["eslint:recommended", "plugin:react/recommended"]
}
See ESLint documentation for more information about extending configuration files.
The rules enabled in this configuration are:
All
This plugin also exports an all
configuration that includes every available rule.
This pairs well with the eslint:all
rule.
{
"plugins": [
"react"
],
"extends": ["eslint:all", "plugin:react/all"]
}
Note: These configurations will import eslint-plugin-react
and enable JSX in parser options.
License
ESLint-plugin-React is licensed under the MIT License.