@edenhealth/eslint-plugin-react-native
v3.3.0
Published
React Native specific linting rules for ESLint
Downloads
3
Maintainers
Readme
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.
Installation
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
Configuration
Add plugins
section and specify ESLint-plugin-React (optional) and ESLint-plugin-react-native as a plugin.
{
"plugins": [
"react",
"react-native"
]
}
If it is not already the case you must also configure ESLint
to support JSX.
{
"ecmaFeatures": {
"jsx": true
}
}
In order to whitelist all browser-like globals, add react-native/react-native
to your config.
{
"env": {
"react-native/react-native": true
}
}
Finally, enable all of the rules that you would like to use.
{
"rules": {
"react-native/no-unused-styles": 2,
"react-native/split-platform-components": 2,
"react-native/no-inline-styles": 2,
"react-native/no-color-literals": 2,
}
}
List of supported rules
- no-unused-styles: Detect
StyleSheet
rules which are not used in your React components - 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
StyleSheet
rules and inline styles containing color literals instead of variables
Shareable configurations
All
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.