React Native Unistyles linting rules for ESLint. This repository is structured like (and contains code from) eslint-plugin-react-native.
Install eslint-plugin-react-native-unistyles
yarn add eslint-plugin-react-native-unistyles -D
Add plugins
section and specify react-native-unistyles as a plugin.
{
"plugins": ["react-native-unistyles"]
}
If it is not already the case you must also configure ESLint
to support JSX.
{
"parserOptions": {
"ecmaFeatures": {
"jsx": true
}
}
}
Then, enable all of the rules that you would like to use.
{
"rules": {
"react-native-unistyles/no-unused-styles": "warn",
"react-native-unistyles/sort-styles": [
"warn",
"asc",
{ "ignoreClassNames": false, "ignoreStyleProperties": false }
],
}
}
-
no-unused-styles: Detect
createStyleSheet
styles which are not used in your React components -
sort-styles: Detect
createStyleSheet
styles which are not in correct sort order
This plugin also exports an all
configuration that includes every available rule.
{
"plugins": [
/* ... */
"react-native-unistyles"
],
"extends": [/* ... */, "plugin:react-native-unistyles/all"]
}
Note: These configurations will import eslint-plugin-react-native-unistyles
and enable JSX in parser options.