refactor: code

Author: cap-Bernardito

README.md

@@ -55,15 +55,15 @@
     "@babel/cli": "^7.10.5",
     "@babel/core": "^7.10.5",
     "@babel/preset-env": "^7.10.4",
-    "@commitlint/cli": "^9.1.1",
+    "@commitlint/cli": "^9.1.2",
     "@commitlint/config-conventional": "^9.1.1",
     "@webpack-contrib/defaults": "^6.3.0",
     "@webpack-contrib/eslint-config-webpack": "^3.0.0",
     "babel-jest": "^26.2.0",
     "commitlint-azure-pipelines-cli": "^1.0.3",
     "copy-webpack-plugin": "^6.0.3",
     "cross-env": "^7.0.2",
-    "css-loader": "^3.6.0",
+    "css-loader": "^4.1.1",
     "del": "^5.1.0",
     "del-cli": "^3.0.1",
     "eslint": "^7.5.0",

package-lock.json

@@ -1,60 +1,59 @@
 import os from 'os';
 
-import pLimit from 'p-limit';
+import { SourceMapConsumer } from 'source-map';
+import { SourceMapSource, RawSource } from 'webpack-sources';
 import RequestShortener from 'webpack/lib/RequestShortener';
-import cssnanoPackageJson from 'cssnano/package.json';
 import {
   util,
   ModuleFilenameHelpers,
   SourceMapDevToolPlugin,
-  javascript,
   version as webpackVersion,
 } from 'webpack';
-import { SourceMapSource, RawSource } from 'webpack-sources';
-import { SourceMapConsumer } from 'source-map';
 import validateOptions from 'schema-utils';
 import serialize from 'serialize-javascript';
+import cssnanoPackageJson from 'cssnano/package.json';
+import pLimit from 'p-limit';
 import Worker from 'jest-worker';
 
 import schema from './options.json';
 
 import { minify as minifyFn } from './minify';
 
-const warningRegex = /\[.+:([0-9]+),([0-9]+)\]/;
+const warningRegex = /\s.+:+([0-9]+):+([0-9]+)/;
 
 class CssnanoPlugin {
   constructor(options = {}) {
     validateOptions(schema, options, {
-      name: 'Cssnano webpack plugin',
+      name: 'Cssnano Plugin',
       baseDataPath: 'options',
     });
 
     const {
-      test = /\.css(\?.*)?$/i,
-      sourceMap = false,
+      minify,
       cssnanoOptions = {
         preset: 'default',
       },
+      test = /\.css(\?.*)?$/i,
       warningsFilter = () => true,
+      sourceMap = false,
       cache = true,
       cacheKeys = (defaultCacheKeys) => defaultCacheKeys,
       parallel = true,
       include,
       exclude,
-      minify,
     } = options;
 
     this.options = {
       test,
-      sourceMap,
-      cssnanoOptions,
       warningsFilter,
+      sourceMap,
       cache,
       cacheKeys,
       parallel,
       include,
       exclude,
       minify,
+      cssnanoOptions,
     };
 
     if (this.options.sourceMap === true) {
@@ -74,14 +73,6 @@ class CssnanoPlugin {
     );
   }
 
-  static buildSourceMap(inputSourceMap) {
-    if (!inputSourceMap || !CssnanoPlugin.isSourceMap(inputSourceMap)) {
-      return null;
-    }
-
-    return new SourceMapConsumer(inputSourceMap);
-  }
-
   static buildError(error, file, sourceMap, requestShortener) {
     if (error.line) {
       const original =
@@ -106,19 +97,19 @@ class CssnanoPlugin {
       }
 
       return new Error(
-        `${file} from Cssnano Webpack Plugin\n${error.message} [${file}:${
-          error.line
-        },${error.column}]${
+        `${file} from Cssnano \n${error.message} [${file}:${error.line},${
+          error.column
+        }]${
           error.stack ? `\n${error.stack.split('\n').slice(1).join('\n')}` : ''
         }`
       );
     }
 
     if (error.stack) {
-      return new Error(`${file} from Cssnano Webpack Plugin\n${error.stack}`);
+      return new Error(`${file} from Cssnano\n${error.stack}`);
     }
 
-    return new Error(`${file} from Cssnano Webpack Plugin\n${error.message}`);
+    return new Error(`${file} from Cssnano\n${error.message}`);
   }
 
   static buildWarning(
@@ -150,11 +141,11 @@ class CssnanoPlugin {
           requestShortener
         ) {
           ({ source } = original);
-          warningMessage = `${warningMessage.replace(warningRegex, '')}`;
 
-          locationMessage = `[${requestShortener.shorten(original.source)}:${
+          warningMessage = `${warningMessage.replace(warningRegex, '')}`;
+          locationMessage = `${requestShortener.shorten(original.source)}:${
             original.line
-          },${original.column}]`;
+          }:${original.column}`;
         }
       }
     }
@@ -163,7 +154,7 @@ class CssnanoPlugin {
       return null;
     }
 
-    return `Cssnano Webpack Plugin: ${warningMessage}${locationMessage}`;
+    return `Cssnano Plugin: ${warningMessage} ${locationMessage}`;
   }
 
   static isWebpack4() {
@@ -217,8 +208,12 @@ class CssnanoPlugin {
 
       let sourceMap = null;
 
-      if (error || (warnings && warnings.length > 0)) {
-        sourceMap = CssnanoPlugin.buildSourceMap(inputSourceMap);
+      if (
+        (error || (warnings && warnings.length > 0)) &&
+        inputSourceMap &&
+        CssnanoPlugin.isSourceMap(inputSourceMap)
+      ) {
+        sourceMap = new SourceMapConsumer(inputSourceMap);
       }
 
       // Handling results
@@ -273,12 +268,10 @@ class CssnanoPlugin {
       }
     };
 
-    const postcssOptions = { to: file, from: file, map: false };
-
     const task = {
+      file,
       input,
       inputSourceMap,
-      postcssOptions,
       map: this.options.sourceMap,
       cssnanoOptions: this.options.cssnanoOptions,
       minify: this.options.minify,
@@ -380,10 +373,7 @@ class CssnanoPlugin {
         }
 
         if (cache.isEnabled() && !taskResult.error) {
-          taskResult = await cache.store(task, taskResult).then(
-            () => taskResult,
-            () => taskResult
-          );
+          await cache.store(task, taskResult);
         }
 
         task.callback(taskResult);
@@ -392,7 +382,7 @@ class CssnanoPlugin {
       };
 
       scheduledTasks.push(
-        limit(() => {
+        limit(async () => {
           const task = getTaskForAsset(assetName).next().value;
 
           if (!task) {
@@ -401,24 +391,29 @@ class CssnanoPlugin {
           }
 
           if (cache.isEnabled()) {
-            return cache.get(task).then(
-              (taskResult) => task.callback(taskResult),
-              () => enqueue(task)
-            );
+            let taskResult;
+
+            try {
+              taskResult = await cache.get(task);
+            } catch (ignoreError) {
+              return enqueue(task);
+            }
+
+            task.callback(taskResult);
+
+            return Promise.resolve();
           }
 
           return enqueue(task);
         })
       );
     }
 
-    return Promise.all(scheduledTasks).then(() => {
-      if (worker) {
-        return worker.end();
-      }
+    await Promise.all(scheduledTasks);
 
-      return Promise.resolve();
-    });
+    if (worker) {
+      await worker.end();
+    }
   }
 
   apply(compiler) {
@@ -486,38 +481,11 @@ class CssnanoPlugin {
       }
 
       if (CssnanoPlugin.isWebpack4()) {
-        const { mainTemplate, chunkTemplate } = compilation;
-        const data = serialize({
-          cssnano: cssnanoPackageJson.version,
-          cssnanoOptions: this.options.cssnanoOptions,
-        });
-
-        // Regenerate `contenthash` for minified assets
-        for (const template of [mainTemplate, chunkTemplate]) {
-          template.hooks.hashForChunk.tap(plugin, (hash) => {
-            hash.update('CssnanoPlugin');
-            hash.update(data);
-          });
-        }
-
         compilation.hooks.optimizeChunkAssets.tapPromise(
           plugin,
           optimizeFn.bind(this, compilation)
         );
       } else {
-        const hooks = javascript.JavascriptModulesPlugin.getCompilationHooks(
-          compilation
-        );
-        const data = serialize({
-          cssnano: cssnanoPackageJson.version,
-          cssnanoOptions: this.options.cssnanoOptions,
-        });
-
-        hooks.chunkHash.tap(plugin, (chunk, hash) => {
-          hash.update('CssnanoPlugin');
-          hash.update(data);
-        });
-
         compilation.hooks.optimizeAssets.tapPromise(
           plugin,
           optimizeFn.bind(this, compilation)

package.json

@@ -1,17 +1,37 @@
 const cssnano = require('cssnano');
 
+/*
+ * We bring to the line here, because when passing result from the worker,
+ * the warning.toString is replaced with native Object.toString
+ * */
+function warningsToString(warnings) {
+  return warnings.map((i) => i.toString());
+}
+
 const minify = async (options) => {
   const {
+    file,
     input,
-    postcssOptions,
     cssnanoOptions,
     map,
     inputSourceMap,
     minify: minifyFn,
   } = options;
 
+  const postcssOptions = { to: file, from: file };
+
   if (minifyFn) {
-    return minifyFn({ input, postcssOptions, cssnanoOptions }, inputSourceMap);
+    const result = await minifyFn(
+      { input, postcssOptions, cssnanoOptions },
+      inputSourceMap
+    );
+
+    return {
+      css: result.css,
+      map: result.map,
+      error: result.error,
+      warnings: warningsToString(result.warnings || []),
+    };
   }
 
   if (inputSourceMap) {
@@ -24,7 +44,7 @@ const minify = async (options) => {
     css: result.css,
     map: result.map,
     error: result.error,
-    warnings: result.warnings(),
+    warnings: warningsToString(result.warnings()),
   };
 };
 
@@ -43,7 +63,11 @@ async function transform(options) {
 
   const result = await minify(options);
 
-  return result;
+  if (result.error) {
+    throw result.error;
+  } else {
+    return result;
+  }
 }
 
 module.exports.minify = minify;