css-mangle-webpack-plugin - npm Package Compare versions

Comparing version 1.0.0-alpha17 to 1.0.0-alpha18

CHANGELOG.md

@@ -41,2 +41,6 @@ # 1.0.0-alpha3
 # 1.0.0-alpha17
-- Fixed issues related to high resource consumption, extended processing time, and unstable builds caused by identifying globally common CSS-related syntax patterns. Modified the process to handle different file types separately.
+- Fixed issues related to high resource consumption, extended processing time, and unstable builds caused by identifying globally common CSS-related syntax patterns. Modified the process to handle different file types separately.
+
+# 1.0.0-alpha18
+- Fixed an issue where the minify option only recognized opacity values between 0 and 1 when parsing `rgb` or `rgba` syntax.
+- Fixed an issue where the logic incorrectly determined that there was no need to explicitly define the opacity value when it was 0%. Now, the explicit value is only omitted when the opacity is 100%.

dist/core/mangler_transpiler.js

@@ -87,3 +87,3 @@ (function (factory) {
             }
-            const t1 = this.options.rgbToHex ? this.transformRGB(asset.syntaxText) : asset.syntaxText;
+            const t1 = this.options.rgbToHex ? this.transformLiterals(asset.syntaxText) : asset.syntaxText;
             const t2 = this.options.comments ? this.transformComments(t1) : t1;
@@ -93,4 +93,5 @@ const t3 = this.options.escapeSequence ? this.transformEscapeSequence(t2) : t2;
         }
-        transformRGB(syntaxText) {
-            const regexpInst = /rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*(,\s*[0-1]+(\.\d+)?\s*)?\)/g;
+        /** About rgb() */
+        transformLiterals(syntaxText) {
+            const regexpInst = /rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*(,\s*(([0-1](\.\d+)?)|(\d{1,3}%))\s*)?\)/g;
             const syntaxList = syntaxText.matchAll(regexpInst);
@@ -103,7 +104,11 @@ let replacedLength = 0;
                     if (index == 3) { // is opacity
-                        return Math.round(parseFloat(str) * 255) % 255 || null;
+                        return str.endsWith("%")
+                            ? Math.round(parseFloat(str.replace("%", "")) / 100 * 255)
+                            : Math.round(parseFloat(str) * 255);
                     }
                     return parseInt(str);
-                });
-                const rgbHexs = rgbNums.filter(v => v != null).map(val => val?.toString(16)); // to Hexadecimal
+                })
+                    // No needs to explicitly define the value when an opacity is 100% as text.
+                    .filter((val, i) => i != 3 || val < 255);
+                const rgbHexs = rgbNums.filter(v => v != null).map(val => val?.toString(16).padStart(2, "0")); // to Hexadecimal
                 const rgbHexStr = "#" + rgbHexs.join("");
@@ -110,0 +115,0 @@ const index = global.index + replacedLength;

dist/types/core/mangler_transpiler.d.ts

@@ -48,5 +48,6 @@ import { Mangler } from "./mangler";
     transform(asset: ManglerAsset): string;
-    transformRGB(syntaxText: string): string;
+    /** About rgb() */
+    transformLiterals(syntaxText: string): string;
     transformComments(syntaxText: string): string;
     transformEscapeSequence(syntaxText: string): string;
 }

package.json

@@ -6,3 +6,3 @@ {
   "author": "Dev Ttangkong",
-  "version": "1.0.0-alpha17",
+  "version": "1.0.0-alpha18",
   "license": "MIT",
@@ -9,0 +9,0 @@ "main": "./dist/index.js",

src/core/mangler_transpiler.ts

@@ -102,3 +102,3 @@ import { StringUtil } from "../utils/string";
 
-        const t1 = this.options.rgbToHex ? this.transformRGB(asset.syntaxText) : asset.syntaxText;
+        const t1 = this.options.rgbToHex ? this.transformLiterals(asset.syntaxText) : asset.syntaxText;
         const t2 = this.options.comments ? this.transformComments(t1) : t1;
@@ -109,4 +109,5 @@ const t3 = this.options.escapeSequence ? this.transformEscapeSequence(t2) : t2;
 
-    transformRGB(syntaxText: string): string {
-        const regexpInst = /rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*(,\s*[0-1]+(\.\d+)?\s*)?\)/g;
+    /** About rgb() */
+    transformLiterals(syntaxText: string): string {
+        const regexpInst = /rgba?\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*(,\s*(([0-1](\.\d+)?)|(\d{1,3}%))\s*)?\)/g;
         const syntaxList = syntaxText.matchAll(regexpInst);
@@ -121,8 +122,13 @@
                 if (index == 3) { // is opacity
-                    return Math.round(parseFloat(str) * 255) % 255 || null;
+                    return str.endsWith("%")
+                        ? Math.round(parseFloat(str.replace("%", "")) / 100 * 255)
+                        : Math.round(parseFloat(str) * 255);
                 }
 
                 return parseInt(str);
-            });
-            const rgbHexs = rgbNums.filter(v => v != null).map(val => val?.toString(16)); // to Hexadecimal
+            })
+            // No needs to explicitly define the value when an opacity is 100% as text.
+            .filter((val, i) => i != 3 || val < 255);
+
+            const rgbHexs = rgbNums.filter(v => v != null).map(val => val?.toString(16).padStart(2, "0")); // to Hexadecimal
             const rgbHexStr = "#" + rgbHexs.join("");
@@ -129,0 +135,0 @@ const index = global.index + replacedLength;

No alert changes

Improved metrics

Total package byte prevSize

102568

increased by1.03%

Lines of code

2131

increased by0.52%

No dependency changes