Menu
When styling a React Native app with Styled Components 5.x I'm getting the warning...
Expected style "borderWidth: 2" to contain units.
This didn't happen with previous versions.
What does the warning mean?
426
Advantages of using Styled-components Eliminates class name bugs: styled-components provide unique class names for your styles, thus eliminating the problems with class names duplications, misspellings, and overlaps.
The biggest advantage of Emotion is its easily handled object styles for writing CSS. Take, for example, the case of styled-components, wherein the developer must create unique names for different components, all while avoiding identical naming styles.
Marking styled-components as external in your package dependencies. Moving styled-components to devDependencies will guarantee that it wouldn't be installed along with your library (npm install or yarn add will ignore devDependencies when a library is installed).
After some research and questions on github I tracked this one down...
Styled Components uses the package css-to-react-native for it's React Native conversions.
css-to-react-native recently released version 3 which now requires units to be present for all measurements. Details here.
You should use px for React Native as it is density independent.
70
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
