ESLint plugin for React Native
React Native specific linting rules for ESLint. This repository is structured like (and contains code from) the excellent eslint-plugin-react.
Install ESLint either locally or globally.
$ npm install --save-dev eslint
To make most use of this plugin, its recommended to install eslint-plugin-react in addition to ESLint. If you installed
ESLint globally, you have to install eslint-plugin-react globally too. Otherwise, install it locally.
$ npm install --save-dev eslint-plugin-react
Similarly, install eslint-plugin-react-native
$ npm install --save-dev eslint-plugin-react-native
plugins section and specify ESLint-plugin-React (optional) and ESLint-plugin-react-native as a plugin.
If it is not already the case you must also configure
ESLint to support JSX.
In order to whitelist all browser-like globals, add
react-native/react-native to your config.
Finally, enable all of the rules that you would like to use.
List of supported rules
- no-unused-styles: Detect
StyleSheetrules which are not used in your React components
- sort-styles: Require style definitions to be sorted alphabetically
- split-platform-components: Enforce using platform specific filenames when necessary
- no-inline-styles: Detect JSX components with inline styles that contain literal values
- no-color-literals: Detect
StyleSheetrules and inline styles containing color literals instead of variables
- no-raw-text: Detect raw text outside of
This plugin also exports an
all configuration that includes every available rule.
"plugins":/* ... */"react-native""extends": /* ... */ "plugin:react-native/all"
Note: These configurations will import
eslint-plugin-react-native and enable JSX in parser options.