A Webpack loader that prefixes classes with custom prefix in React components
MyComponent.js
class MyComponent extends React.Component {
render () {
return <div className='myclass'></div>
}
}
export default MyComponent
Output:
class MyComponent extends React.Component {
render () {
return <div className='your_prefix-myclass'></div>
}
}
export default MyComponent
Also works with classnames module!
$ npm install react-classname-prefix-loader --save-dev
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loaders: ['react-hot', 'babel-loader', 'react-classname-prefix-loader?prefix=your_prefix'],
},
],
},
- Use it with postcss-class-prefix for css files