CSS hot reload for extract-text-webpack-plugin
npm install webpack-extract-css-hot-reloadThis simple loader was created to hot reload css files which have been extracted with extract-text-webpack-plugin. Based on css-hot-loader.
First install the package from npm
``sh`
$ npm install webpack-extract-css-hot-reload --save-dev$3
Update your webpack.config.ts. For example
`typescript`
module: {
rules: [
{
test: /\.css$/,
loader: ['webpack-extract-css-hot-reload'].concat(ExtractTextPlugin.extract([
{
loader: 'css-loader',
}, {
loader: 'postcss-loader',
},
]) as any),
},
]
}webpack-extract-css-hot-reload
NOTE: should be defined before extract-text-webpack-plugin.
Tag the stylesheets which need hot reloading with data-hot.
index.html
`html
That's all! You're good to go. :)
$3
#### selector
If you don't like data-hot for tagging hot reloadable content, then you can pass a custom HTML attribute. For example 'webpack-extract-css-hot-reload?selector=data-lukewarm'`.MIT License