From 8c3370dd3095847928beb70b3857c79ea361778b Mon Sep 17 00:00:00 2001
From: Robert Grimm <rgrimm@advsol.com>
Date: Mon, 11 Jun 2018 13:56:24 -0500
Subject: [PATCH] should fix extract-text-webpack-plugin deprecation

---
 package.json             |  5 +++--
 webpack.config.vendor.js | 21 +++++++++++++++------
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index 722be23e..1c1c8d60 100644
--- a/package.json
+++ b/package.json
@@ -68,6 +68,7 @@
     "zone.js": "^0.8.26"
   },
   "devDependencies": {
+    "@angular-devkit/build-angular": "~0.6.6",
     "@angular/cli": "^6.0.5",
     "@angular/compiler-cli": "6.0.3",
     "@ngtools/webpack": "^6.0.5",
@@ -88,10 +89,10 @@
     "karma-remap-coverage": "^0.1.5",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^2.0.4",
+    "mini-css-extract-plugin": "^0.4.0",
     "tslint": "^5.10.0",
     "uglifyjs-webpack-plugin": "^1.2.5",
     "webpack-bundle-analyzer": "^2.13.1",
-    "webpack-cli": "^2.1.4",
-    "@angular-devkit/build-angular": "~0.6.6"
+    "webpack-cli": "^2.1.4"
   }
 }
diff --git a/webpack.config.vendor.js b/webpack.config.vendor.js
index 17d2fdb3..eba9a7f8 100644
--- a/webpack.config.vendor.js
+++ b/webpack.config.vendor.js
@@ -1,6 +1,6 @@
 const path = require('path');
 const webpack = require('webpack');
-const ExtractTextPlugin = require('extract-text-webpack-plugin');
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const merge = require('webpack-merge');
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
 const treeShakableModules = [
@@ -30,7 +30,12 @@ const allModules = treeShakableModules.concat(nonTreeShakableModules);
 
 module.exports = (env) => {
   console.log(`env = ${JSON.stringify(env)}`)
-  const extractCSS = new ExtractTextPlugin('vendor.css');
+  const extractCSS = new MiniCssExtractPlugin({
+    // Options similar to the same options in webpackOptions.output
+    // both options are optional
+    filename: "[name].css",
+    chunkFilename: "[id].css"
+  });
   const isDevBuild = !(env && env.prod);
   const sharedConfig = {
     mode: isDevBuild ? "development" : "production",
@@ -71,9 +76,10 @@ module.exports = (env) => {
     module: {
       rules: [{
         test: /\.css(\?|$)/,
-        use: extractCSS.extract({
-          use: isDevBuild ? 'css-loader' : 'css-loader?minimize'
-        })
+        use: [
+          MiniCssExtractPlugin.loader,
+          isDevBuild ? 'css-loader' : 'css-loader?minimize'
+        ]
       }]
     },
     plugins: [
@@ -119,7 +125,10 @@ module.exports = (env) => {
     module: {
       rules: [{
         test: /\.css(\?|$)/,
-        use: ['to-string-loader', isDevBuild ? 'css-loader' : 'css-loader?minimize']
+        use: [
+          MiniCssExtractPlugin.loader,
+          isDevBuild ? 'css-loader' : 'css-loader?minimize'
+        ]
       }]
     },
     plugins: [