Support Webpack@5.x

.gitignore

@@ -2,3 +2,5 @@ node_modules
 *.log
 dist
 coverage
+package-lock.json
+

.travis.yml

@@ -1,21 +1,9 @@
 sudo: false
 language: node_js
 node_js:
-  - 4
-  - 6
   - 8
-env:
-  - USE_WEBPACK2=false
-  - USE_WEBPACK2=true
-matrix:
-  exclude:
-    # TODO: Fix barf on peer dependencies with npm@2.
-    - env: USE_WEBPACK2=true
-      node_js: 4
-
-before_install:
-  - 'if [ "${USE_WEBPACK2}" == "true" ]; then npm install --save-dev webpack@2.1.0-beta.19 extract-text-webpack-plugin@2.0.0-beta.4; fi'
-
+  - 10
+  - 12
 after_script:
   - npm install coveralls
   - cat ./coverage/coverage.json | ./node_modules/.bin/adana --format lcov | ./node_modules/coveralls/bin/coveralls.js

README.md

@@ -21,7 +21,7 @@ npm install --save css-split-webpack-plugin
 Simply add an instance of `CSSSplitWebpackPlugin` to your list of plugins in your webpack configuration file _after_ `ExtractTextPlugin`. That's it!
 
 ```javascript
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var MiniCssExtractPlugin = require('mini-css-extract-plugin');
 var CSSSplitWebpackPlugin = require('../').default;
 
 module.exports = {
@@ -35,11 +35,14 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.css$/,
-      loader: ExtractTextPlugin.extract('style-loader', 'css-loader'),
+      use: [
+        MiniCssExtractPlugin.loader,
+        'css-loader',
+      ],
     }],
   },
   plugins: [
-    new ExtractTextPlugin('styles.css'),
+    new MiniCssExtractPlugin({filename: 'style.css'}),
     new CSSSplitWebpackPlugin({size: 4000}),
   ],
 };

example/basic/webpack.config.js

@@ -1,5 +1,5 @@
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var CSSSplitWebpackPlugin = require('../../').default;
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const CSSSplitWebpackPlugin = require('../../').default;
 
 module.exports = {
   entry: './index.js',
@@ -10,19 +10,19 @@ module.exports = {
     filename: 'bundle.js',
   },
   module: {
-    loaders: [{
+    rules: [{
       test: /\.css$/,
-      loader: ExtractTextPlugin.extract.length !== 1 ?
-        ExtractTextPlugin.extract('style-loader', 'css-loader') :
-        ExtractTextPlugin.extract({
-          fallbackLoader: 'style-loader',
-          loader: 'css-loader',
-        }),
+      use: [
+        MiniCssExtractPlugin.loader,
+        'css-loader',
+      ],
     }],
   },
   devtool: 'source-map',
   plugins: [
-    new ExtractTextPlugin("styles.css"),
+    new MiniCssExtractPlugin({
+      filename: 'styles.css',
+    }),
     new CSSSplitWebpackPlugin({size: 3, imports: true}),
   ],
 };

example/less/webpack.config.js

@@ -1,5 +1,5 @@
-var ExtractTextPlugin = require('extract-text-webpack-plugin');
-var CSSSplitWebpackPlugin = require('../../').default;
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const CSSSplitWebpackPlugin = require('../../').default;
 
 module.exports = {
   entry: './index.js',
@@ -10,16 +10,20 @@ module.exports = {
     filename: 'bundle.js',
   },
   module: {
-    loaders: [{
+    rules: [{
       test: /\.less$/,
-      loader: ExtractTextPlugin.extract(
-        'css?-url&-autoprefixer&sourceMap!less?sourceMap'
-      ),
+      use: [
+        MiniCssExtractPlugin.loader,
+        'css-loader',
+        'less-loader',
+      ],
     }],
   },
   devtool: 'source-map',
   plugins: [
-    new ExtractTextPlugin("styles.css"),
+    new MiniCssExtractPlugin({
+      filename: 'styles.css',
+    }),
     new CSSSplitWebpackPlugin({size: 3}),
   ],
 };