I'm relatively new to react native and when setting up my eslint config I started seeing errors for lines like this:
color: '#413C44', --> Color Literal ... (react-native/no-color-literals)
I started to disable it, but it seems like a popular rule. I'm not seeing an explanation online for why color literals in react native are a bad thing. Does anyone know why?
When developing UIs, we often find ourselves reusing the same colors in multiple places in the UI. If the colors have to be updated, they likely have to be updated across the board. So it's good practice to store the color definitions in variables instead of hardcoding them inside styles. This rule will detect color properties that have literals (ie strings) as values.
The linting rule requires you to use variables for your colors and reuse those (keyword theming). E.g. setup a textColor once and reuse everywhere, you would then only change this in one place to change the text color everywhere.
