css-loader-dashed-class-names
Transform CSS camel-case class names to dashed-case in css-loader
.
This library relies on getLocalIdent
of css-loader, which requires webpack >= 2.2.1
.
How to use
Install
npm i --save-dev css-loader-dashed-class-names
Webpack Configuration
webpack.config.js
const precss = const autoprefixer = const postcssModuleValues = const dashedCssClassName = // put css-loader in module.rules test: /\.css$/ use: loader: 'style-loader' loader: 'css-loader' options: modules: true importLoaders: '1' localIdentName: '[name]-[local]' getLocalIdent: dashedCssClassName loader: 'postcss-loader' options: precss autoprefixer postcssModuleValues
JS/CSS
AwesomeComponent.css
AwesomeComponent.js
{ return <div className=stylesmyRoot> You are awesome! </div> }
Output