eslint-plugin-react

eslint-plugin-react is a collection of React-specific linting rules for ESLint. It helps developers enforce React best practices, catch common mistakes, and maintain consistent code style in React projects. Installation is straightforward via npm: npm install eslint eslint-plugin-react --save-dev. The plugin works with both the legacy .eslintrc configuration system and the newer eslint.config.js flat config system introduced in ESLint v8.21.0. The plugin exports several shareable configurations: recommended (enforces React good practices), all (includes every available rule), and jsx-runtime (for React 17+ new JSX transform). Flat config variants are also available as flat.recommended, flat.all, and flat['jsx-runtime']. These configurations automatically enable JSX in parser options. Configuration supports shared settings for react.pragma, react.fragment, react.version, react.createClass, propWrapperFunctions, componentWrapperFunctions, formComponents, and linkComponents. These settings allow customization for projects using MobX observer, styled-components, custom form components, or custom link components. The plugin includes a large number of rules covering JSX formatting (jsx-indent, jsx-curly-spacing, jsx-props-no-multi-spaces), component definitions (display-name, function-component-definition), props validation (jsx-no-duplicate-props, default-props-match-prop-types), hooks (hook-use-state, forward-ref-uses-ref), accessibility (button-has-type, iframe-missing-sandbox), security (jsx-no-target-blank, jsx-no-script-url), and many more. Many rules are automatically fixable via the --fix CLI option, and some provide manual fix suggestions through editor integrations. The rules list includes deprecated rules marked with a cross symbol, and the plugin maintains compatibility with both ESLint v8 and v9.