Add plugin to trim CSS files

Author: thecrypticace

build/TrimCSSPlugin.js

@@ -0,0 +1,26 @@
+const pluginName = "TrimCSSPlugin";
+const TrimmedSource = require("./TrimmedSource");
+
+module.exports = class TrimCSSPlugin {
+  isCSSChunk(chunk) {
+    return chunk.ids.includes("mini-css-extract-plugin");
+  }
+
+  apply(compiler) {
+    compiler.hooks.compilation.tap(pluginName, compilation => {
+      compilation.hooks.optimizeChunkAssets.tap(pluginName, chunks => {
+        for (const chunk of chunks) {
+          // if (!this.isCSSChunk(chunk)) {
+          //   continue;
+          // }
+
+          for (const file of chunk.files) {
+            compilation.assets[file] = new TrimmedSource(
+              compilation.assets[file]
+            );
+          }
+        }
+      });
+    });
+  }
+};

build/TrimmedSource.js

@@ -0,0 +1,66 @@
+const Source = require("webpack-sources/lib/Source");
+
+class TrimmedSource extends Source {
+  constructor(source) {
+    super();
+
+    this._source = source;
+  }
+
+  source() {
+    const src =
+      typeof this._source === "string" ? this._source : this._source.source();
+
+    if (src.indexOf(".red[data-v-") !== -1) {
+      // debugger;
+    }
+
+    return trimStr(src);
+  }
+
+  node(options) {
+    return new SourceNode(null, null, null, [
+      cloneAndTrim(this._source.node(options))
+    ]);
+  }
+
+  listMap(options) {
+    return this._source.listMap(options).mapGeneratedCode(trimStr);
+  }
+
+  updateHash(hash) {
+    if (typeof this._source === "string") {
+      hash.update(this._source);
+    } else {
+      this._source.updateHash(hash);
+    }
+  }
+}
+
+const whitespacePattern = /(^\s+|\s+$)/g;
+
+function trimStr(str) {
+  return str.replace(whitespacePattern, "");
+}
+
+function cloneAndTrim(node) {
+  if (typeof node === "string") {
+    return trimStr(node);
+  }
+
+  const newNode = new SourceNode(
+    node.line,
+    node.column,
+    node.source,
+    node.children.map(cloneAndTrim),
+    node.name
+  );
+
+  newNode.sourceContents = node.sourceContents;
+
+  return newNode;
+}
+
+require("webpack-sources/lib/SourceAndMapMixin")(TrimmedSource.prototype);
+
+module.exports = TrimmedSource;

build/index.js

@@ -1 +1,2 @@
+module.exports.TrimCSSPlugin = require("./TrimCSSPlugin");
 module.exports.RemoveStyleScriptChunksPlugin = require("./RemoveStyleScriptChunksPlugin");

webpack.config.js

@@ -1,7 +1,7 @@
 const path = require("path");
 const webpack = require("webpack");
 const { VueLoaderPlugin } = require("vue-loader");
-const { RemoveStyleScriptChunksPlugin } = require("./build");
+const { TrimCSSPlugin, RemoveStyleScriptChunksPlugin } = require("./build");
 
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 module.exports = {
@@ -57,6 +57,7 @@ module.exports = {
     }),
 
     new RemoveStyleScriptChunksPlugin()
+    // new TrimCSSPlugin(),
   ],
 
   optimization: {