feat: add optimize-css-assets-webpack-plugin

ccontrols · Oct 24, 2020 · ed297f5 · ed297f5
1 parent 75a1eef
commit ed297f5
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 2 deletions.
diff --git a/core/webpack-configs/package.json b/core/webpack-configs/package.json
@@ -41,6 +41,7 @@
     "deepmerge": "^4.2.2",
     "extract-css-chunks-webpack-plugin": "^4.7.5",
     "file-loader": "^6.0.0",
+    "optimize-css-assets-webpack-plugin": "^5.0.4",
     "raw-loader": "^4.0.1",
     "sass": "^1.27.0",
     "sass-loader": "^10.0.4",
@@ -54,6 +55,7 @@
     "@babel/preset-env": "^7.9.0",
     "@component-controls/ts-markdown-docs": "^1.21.0",
     "@types/jest": "^26.0.10",
+    "@types/optimize-css-assets-webpack-plugin": "^5.0.1",
     "cross-env": "^5.2.1",
     "eslint": "^6.5.1",
     "jest": "^26.4.2"

diff --git a/core/webpack-configs/src/react/index.ts b/core/webpack-configs/src/react/index.ts
@@ -1,5 +1,6 @@
 import * as path from 'path';
 import ExtractCssPlugin from 'extract-css-chunks-webpack-plugin';
+import OptimizeCssAssetsWebpackPlugin from 'optimize-css-assets-webpack-plugin';
 
 import {
   PresetType,
@@ -8,12 +9,14 @@ import {
 } from '@component-controls/core';
 
 export const react: PresetType = (options: BuildProps) => {
-  return {
+  const isProd = process.env.NODE_ENV === 'production';
+  const result: PresetType = {
     plugins: [
       new ExtractCssPlugin({
         filename: options.cssFileName || defCssFileName,
       }),
     ],
+    optimization: { minimizer: [] },
     performance: { hints: false },
     module: {
       rules: [
@@ -121,4 +124,16 @@ export const react: PresetType = (options: BuildProps) => {
       extensions: ['.ts', '.tsx', '.js', '.jsx'],
     },
   };
+  if (isProd) {
+    result.optimization = {
+      minimizer: [
+        new OptimizeCssAssetsWebpackPlugin({
+          cssProcessorOptions: {
+            discardComments: { removeAll: true },
+          },
+        }),
+      ],
+    };
+  }
+  return result;
 };
diff --git a/yarn.lock b/yarn.lock
@@ -5505,6 +5505,13 @@
   resolved "https://registry.yarnpkg.com/@types/npmlog/-/npmlog-4.1.2.tgz#d070fe6a6b78755d1092a3dc492d34c3d8f871c4"
   integrity sha512-4QQmOF5KlwfxJ5IGXFIudkeLCdMABz03RcUXu+LCb24zmln8QW6aDjuGl4d4XPVLf2j+FnjelHTP7dvceAFbhA==
 
+"@types/optimize-css-assets-webpack-plugin@^5.0.1":
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/@types/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.1.tgz#1f437ef9ef937b393687a8819be2d2fddc03b069"
+  integrity sha512-qyi5xmSl+DTmLFtVtelhso3VnNQYxltfgMa+Ed02xqNZCZBD0uYR6i64FmcwfieDzZRdwkJxt9o2JHq/5PBKQg==
+  dependencies:
+    "@types/webpack" "*"
+
 "@types/overlayscrollbars@^1.9.0":
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/@types/overlayscrollbars/-/overlayscrollbars-1.12.0.tgz#98456caceca8ad73bd5bb572632a585074e70764"
@@ -18492,7 +18499,7 @@ opn@^5.5.0:
   dependencies:
     is-wsl "^1.1.0"
 
-optimize-css-assets-webpack-plugin@^5.0.3:
+optimize-css-assets-webpack-plugin@^5.0.3, optimize-css-assets-webpack-plugin@^5.0.4:
   version "5.0.4"
   resolved "https://registry.yarnpkg.com/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.4.tgz#85883c6528aaa02e30bbad9908c92926bb52dc90"
   integrity sha512-wqd6FdI2a5/FdoiCNNkEvLeA//lHHfG24Ln2Xm2qqdIk4aOlsR18jwpyOihqQ8849W3qu2DX8fOYxpvTMj+93A==