The default ESLint config for Fooxly projects using React Native.
About 40% of your donation goes to one of the charities we support. For further information or questions please visit our website or contact us via charity@fooxly.com.
npm install --save-dev @fooxly/eslint-config-react-nativeyarn add -D @fooxly/eslint-config-react-nativeWe recommend using Babel's ESLint parser.
{
"parser": "babel-eslint",
"extends": ["@fooxly/eslint-config-react-native"]
}...
"eslintConfig": {
"parser": "babel-eslint",
"extends": ["@fooxly/eslint-config-react-native"]
}
...This configuration extends our React config with a few additional rules for React Native.
Logging level: Error
Unless variables (like Animations) are used for inline styling, these slow down your app (mostly during re-renders) and are therefore not allowed.
Logging level: Error
This one is obvious, reduces the bundle size due to the styles not being used anyways.
Logging level: Warning
We (like others) prefer storing all our color variables inside a theme file (like styled-components theming) or folder.
Logging level: Warning
Splitting platform-specific parts of your app in multiple files produces the correct bundle per platform.
Logging level: Error
These cause an unnecessary performance loss due to the array's identity changing on every re-render, and are therefore not allowed.
Are you using this in one of your projects? Include this badge in your README to let others know that your code is using the Fooxly code style.
[](https://www.npmjs.com/package/@fooxly/eslint-config-react-native)