File tree Expand file tree Collapse file tree 1 file changed +11
-10
lines changed
Expand file tree Collapse file tree 1 file changed +11
-10
lines changed Original file line number Diff line number Diff line change @@ -401,29 +401,30 @@ export default {
401401
402402### [ Extract CSS] [ ExtractPlugin ]
403403
404- [ ExtractPlugin ] : https://github.com/webpack-contrib/extract-text-webpack -plugin
404+ [ ExtractPlugin ] : https://github.com/webpack-contrib/mini-css-extract -plugin
405405
406406** webpack.config.js**
407407``` js
408- const ExtractTextPlugin = require (' extract-text-webpack-plugin' )
408+ const MiniCssExtractPlugin = require (' mini-css-extract-plugin' );
409+ const devMode = process .env .NODE_ENV !== ' production' ;
409410
410411module .exports = {
411412 module: {
412413 rules: [
413414 {
414415 test: / \. css$ / ,
415- use: ExtractTextPlugin .extract ({
416- fallback: ' style-loader' ,
417- use: [
418- { loader: ' css-loader' , options: { importLoaders: 1 } },
419- ' postcss-loader'
420- ]
421- })
416+ use: [
417+ devMode ? ' style-loader' : MiniCssExtractPlugin .loader ,
418+ ' css-loader' ,
419+ ' postcss-loader' ,
420+ ]
422421 }
423422 ]
424423 },
425424 plugins: [
426- new ExtractTextPlugin (' [name].css' )
425+ new MiniCssExtractPlugin ({
426+ filename: devMode ? ' [name].css' : ' [name].[hash].css' ,
427+ })
427428 ]
428429}
429430```
You can’t perform that action at this time.
0 commit comments