Merge pull request #52 from tameraydin/master

feat: introduce mangleCssVariables option

Author: sndyuk

README.md

@@ -36,6 +36,7 @@ module.exports = {
   plugins: [
     new MangleCssClassPlugin({
       classNameRegExp: '[cl]-[a-z][a-zA-Z0-9_]*',
+      mangleCssVariables: true,
       log: true,
     }),
   ],
@@ -90,6 +91,9 @@ classGenerator: (original, opts, context) => {
 }
 ```
 
+#### mangleCssVariables
+When truthy, the plugin will also mangle CSS variables (custom properties) whose name is matching the same ``classNameRegExp``. Disabled by default.
+
 ### Example
 #### Source code
 ```html

lib/optimizer.js

@@ -19,9 +19,13 @@ const validate = (opts, classGenerator) => {
 const optimize = (compiler, [file, originalSource], compilation, opts, classGenerator) => {
   let classnameRegex;
   if (file.match(/.+\.css.*$/)) {
-    classnameRegex = new RegExp(`\\\.(${opts.classNameRegExp})`, 'g');
+    classnameRegex = opts.mangleCssVariables
+      ? new RegExp(`(?:\\\.|--)(${opts.classNameRegExp})`, 'g')
+      : new RegExp(`\\\.(${opts.classNameRegExp})`, 'g');
   } else if (file.match(/.+\.js.*$/) || file.match(/.+\.html.*$/)) {
-    classnameRegex = new RegExp(`["'\`.\\\s](${opts.classNameRegExp})`, 'g');
+    classnameRegex = opts.mangleCssVariables
+      ? new RegExp(`(?:["'\`.\\\s]|--)(${opts.classNameRegExp})`, 'g')
+      : new RegExp(`["'\`.\\\s](${opts.classNameRegExp})`, 'g');
   }
   if (!classnameRegex) {
     return;