diff --git a/package-lock.json b/package-lock.json index 4633379..31d5739 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5414,6 +5414,28 @@ "dom-walk": "0.1.1" } }, + "mini-css-extract-plugin": { + "version": "0.4.2", + "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.4.2.tgz", + "integrity": "sha512-ots7URQH4wccfJq9Ssrzu2+qupbncAce4TmTzunI9CIwlQMp2XI+WNUw6xWF6MMAGAm1cbUVINrSjATaVMyKXg==", + "requires": { + "loader-utils": "1.1.0", + "schema-utils": "1.0.0", + "webpack-sources": "1.1.0" + }, + "dependencies": { + "schema-utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-1.0.0.tgz", + "integrity": "sha512-i27Mic4KovM/lnGsy8whRCHhc7VicJajAjTrYg11K9zfZXnYIt4k5F+kZkwjnrhKzLic/HLU4j11mjsz2G/75g==", + "requires": { + "ajv": "6.3.0", + "ajv-errors": "1.0.0", + "ajv-keywords": "3.1.0" + } + } + } + }, "minimalistic-assert": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz", diff --git a/package.json b/package.json index db01b1d..41ae233 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "file-loader": "^1.1.11", "font-awesome": "^4.7.0", "html-webpack-plugin": "^3.2.0", + "mini-css-extract-plugin": "^0.4.2", "node-sass": "^4.9.3", "normalize.css": "^8.0.0", "open-color": "^1.6.3", diff --git a/webpack.config.js b/webpack.config.js index 21d7fe1..5173b1c 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,5 +1,5 @@ const CleanWebpackPlugin = require('clean-webpack-plugin'); -const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const FaviconsWebpackPlugin = require('favicons-webpack-plugin'); const path = require('path'); @@ -28,17 +28,29 @@ module.exports = { }, { test: /\.scss$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: ['css-loader', 'postcss-loader', 'sass-loader'], - }), + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: { + publicPath: './.', + }, + }, + 'css-loader', + 'postcss-loader', + 'sass-loader', + ], }, { test: /\.css$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: ['css-loader'], - }), + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: { + publicPath: './.', + }, + }, + 'css-loader', + ], }, { test: /\.woff2?$|\.ttf$|\.eot$|\.svg$/, @@ -64,10 +76,9 @@ module.exports = { new CleanWebpackPlugin(['./dist'], { verbose: true, }), - new ExtractTextPlugin({ + new MiniCssExtractPlugin({ filename: '[name].[hash].css', - disable: false, - allChunks: true, + chunkFilename: '[id].css', }), new HtmlWebpackPlugin({ filename: 'index.html',