babel-plugin-styled-components-named

Add display names to styled components

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
babel-plugin-styled-components-named
1,064830.1.17 years ago7 years agoMinified + gzip package size for babel-plugin-styled-components-named in KB

Readme

babel-plugin-styled-components-named
Add display names to styled-components
const Button = styled.button` width: 100px; `
By default looks like <styled.button/> in react dev tools. This plugin names it <Button/>.
Supported cases for now:
const A = styled.div` color: red; `

let B = styled(OtherComponent).div` color: red; `

let C
C = styled.div` color: red; `

const styles = { D: styled.div` color: red; ` }

Installation

npm install -D babel-plugin-styled-components-named

Usage

Via .babelrc

.babelrc
{
  "plugins": ["styled-components-named"]
}