Search code examples
reactjsstyled-components

Warning for wrong styles in styled-components

How to we get warning or error messages from styled-components, when we write some wrong styles? Also do we have any linting tool for style components?

Solution

  • Yes you get style warnings when a certain property doesn't exist. For example if you apply 

    {
align-items: center
}

    to a <Text/> you'll get a warning that this property doesn't exist on type Text.

    For style linting I recently came across stylelint which helps with linting in styled-components. Here's the link to read more about it https://medium.com/styled-components/announcing-production-ready-linting-for-styled-components-58adcdc4a97