mini-css-extract-plugin - npm Package Compare versions

Comparing version 2.5.1 to 2.5.2

dist/index.js

@@ -45,2 +45,4 @@ "use strict";
 
+/** @typedef {import("./loader.js").Dependency} LoaderDependency */
+
 /**
@@ -91,3 +93,11 @@ * @typedef {Object} LoaderOptions
 const DEFAULT_FILENAME = "[name].css";
+/**
+ * @type {Set<string>}
+ */
+
 const TYPES = new Set([MODULE_TYPE]);
+/**
+ * @type {ReturnType<Module["codeGeneration"]>}
+ */
+
 const CODE_GENERATION_RESULT = {
@@ -97,4 +107,29 @@ sources: new Map(),
 };
+/** @typedef {Module & { content: Buffer, media?: string, sourceMap?: Buffer, supports?: string, layer?: string, assets?: { [key: string]: TODO }, assetsInfo?: Map<string, AssetInfo> }} CssModule */
+
+/** @typedef {{ context: string | null, identifier: string, identifierIndex: number, content: Buffer, sourceMap?: Buffer, media?: string, supports?: string, layer?: TODO, assetsInfo?: Map<string, AssetInfo>, assets?: { [key: string]: TODO }}} CssModuleDependency */
+
+/** @typedef {{ new(dependency: CssModuleDependency): CssModule }} CssModuleConstructor */
+
+/** @typedef {Dependency & CssModuleDependency} CssDependency */
+
+/** @typedef {Omit<LoaderDependency, "context">} CssDependencyOptions */
+
+/** @typedef {{ new(loaderDependency: CssDependencyOptions, context: string | null, identifierIndex: number): CssDependency }} CssDependencyConstructor */
+
+/**
+ *
+ * @type {WeakMap<Compiler["webpack"], CssModuleConstructor>}
+ */
+
 const cssModuleCache = new WeakMap();
+/**
+ * @type {WeakMap<Compiler["webpack"], CssDependencyConstructor>}
+ */
+
 const cssDependencyCache = new WeakMap();
+/**
+ * @type {WeakSet<Compiler["webpack"]>}
+ */
+
 const registered = new WeakSet();
@@ -104,5 +139,4 @@
   /**
-   * @private
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssModule}
+   * @returns {CssModuleConstructor}
    */
@@ -114,3 +148,6 @@ static getCssModule(webpack) {
     if (cssModuleCache.has(webpack)) {
-      return cssModuleCache.get(webpack);
+      return (
+        /** @type {CssModuleConstructor} */
+        cssModuleCache.get(webpack)
+      );
     }
@@ -120,3 +157,3 @@
       /**
-       * @param {{ context: string, identifier: string, identifierIndex: number, content: Buffer, layer: string | null, supports?: string, media: string, sourceMap?: Buffer, assets: { [key: string]: Source }, assetsInfo: Map<string, AssetInfo> }} build
+       * @param {CssModuleDependency} dependency
        */
@@ -135,3 +172,5 @@ constructor({
       }) {
-        super(MODULE_TYPE, context);
+        super(MODULE_TYPE,
+        /** @type {string | undefined} */
+        context);
         this.id = "";
@@ -193,3 +232,3 @@ this._context = context;
       /**
-       * @param {Module & CssModule} module
+       * @param {Module} module
        */
@@ -199,11 +238,39 @@
       updateCacheModule(module) {
-        if (this.content !== module.content || this.layer !== module.layer || this.supports !== module.supports || this.media !== module.media || this.sourceMap !== module.sourceMap || this.assets !== module.assets || this.assetsInfo !== module.assetsInfo) {
+        if (this.content !==
+        /** @type {CssModule} */
+        module.content || this.layer !==
+        /** @type {CssModule} */
+        module.layer || this.supports !==
+        /** @type {CssModule} */
+        module.supports || this.media !==
+        /** @type {CssModule} */
+        module.media || this.sourceMap !==
+        /** @type {CssModule} */
+        module.sourceMap || this.assets !==
+        /** @type {CssModule} */
+        module.assets || this.assetsInfo !==
+        /** @type {CssModule} */
+        module.assetsInfo) {
           this._needBuild = true;
-          this.content = module.content;
-          this.layer = module.layer;
-          this.supports = module.supports;
-          this.media = module.media;
-          this.sourceMap = module.sourceMap;
-          this.assets = module.assets;
-          this.assetsInfo = module.assetsInfo;
+          this.content =
+          /** @type {CssModule} */
+          module.content;
+          this.layer =
+          /** @type {CssModule} */
+          module.layer;
+          this.supports =
+          /** @type {CssModule} */
+          module.supports;
+          this.media =
+          /** @type {CssModule} */
+          module.media;
+          this.sourceMap =
+          /** @type {CssModule} */
+          module.sourceMap;
+          this.assets =
+          /** @type {CssModule} */
+          module.assets;
+          this.assetsInfo =
+          /** @type {CssModule} */
+          module.assetsInfo;
         }
@@ -354,5 +421,4 @@ } // eslint-disable-next-line class-methods-use-this
   /**
-   * @private
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssDependency}
+   * @returns {CssDependencyConstructor}
    */
@@ -366,3 +432,6 @@
     if (cssDependencyCache.has(webpack)) {
-      return cssDependencyCache.get(webpack);
+      return (
+        /** @type {CssDependencyConstructor} */
+        cssDependencyCache.get(webpack)
+      );
     }
@@ -372,3 +441,3 @@
       /**
-       * @param {{ identifier: string, content: Buffer, layer?: string, supports?: string, media: string, sourceMap?: Buffer }} build
+       * @param {CssDependencyOptions} loaderDependency
        * @param {string | null} context
@@ -495,3 +564,3 @@ * @param {number} identifierIndex
      * @private
-     * @type {WeakMap<Chunk, Set<TODO>>}
+     * @type {WeakMap<Chunk, Set<CssModule>>}
      * @private
@@ -522,4 +591,5 @@ */
       linkType: // Todo in next major release set default to "false"
-      // @ts-ignore
-      typeof options.linkType === "boolean" && options.linkType === true || typeof options.linkType === "undefined" ? "text/css" : options.linkType,
+      typeof options.linkType === "boolean" &&
+      /** @type {boolean} */
+      options.linkType === true || typeof options.linkType === "undefined" ? "text/css" : options.linkType,
       attributes: options.attributes
@@ -571,5 +641,6 @@ };
     if (this.options.experimentalUseImportModule) {
-      // @ts-ignore
-      if (typeof compiler.options.experiments.executeModule === "undefined") {
-        // @ts-ignore
+      if (typeof
+      /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */
+      compiler.options.experiments.executeModule === "undefined") {
+        /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */
         // eslint-disable-next-line no-param-reassign
@@ -609,4 +680,8 @@ compiler.options.experiments.executeModule = true;
       } = NormalModule.getCompilationHooks(compilation);
-      normalModuleHook.tap(pluginName, loaderContext => {
-        // @ts-ignore
+      normalModuleHook.tap(pluginName,
+      /**
+       * @param {object} loaderContext
+       */
+      loaderContext => {
+        /** @type {object & { [pluginSymbol]: { experimentalUseImportModule: boolean | undefined } }} */
         // eslint-disable-next-line no-param-reassign
@@ -621,4 +696,4 @@ loaderContext[pluginSymbol] = {
         /**
-         * @param {{ dependencies: CssDependency[] }} dependencies
-         * @param {(err: Error| null, module: Module) => void} callback
+         * @param {{ dependencies: Dependency[] }} dependencies
+         * @param {(arg0?: Error, arg1?: TODO) => void} callback
          */
@@ -629,4 +704,6 @@ // eslint-disable-next-line class-methods-use-this
         }, callback) {
-          // @ts-ignore
-          callback(null, new CssModule(dependency));
+          // eslint-disable-next-line no-undefined
+          callback(undefined, new CssModule(
+          /** @type {CssDependency} */
+          dependency));
         }
@@ -636,4 +713,3 @@
 
-      compilation.dependencyFactories.set(CssDependency, // @ts-ignore
-      new CssModuleFactory());
+      compilation.dependencyFactories.set(CssDependency, new CssModuleFactory());
 
@@ -646,5 +722,10 @@ class CssDependencyTemplate {
 
-      compilation.dependencyTemplates.set(CssDependency, new CssDependencyTemplate()); // @ts-ignore
-
-      compilation.hooks.renderManifest.tap(pluginName, (result, {
+      compilation.dependencyTemplates.set(CssDependency, new CssDependencyTemplate());
+      compilation.hooks.renderManifest.tap(pluginName,
+      /**
+       * @param {ReturnType<Compilation["getRenderManifest"]>} result
+       * @param {Parameters<Compilation["getRenderManifest"]>[0]} chunk
+       * @returns {TODO}
+       */
+      (result, {
         chunk
@@ -663,6 +744,10 @@ }) => {
         }
+        /** @type {CssModule[]} */
 
-        const renderedModules = Array.from(this.getChunkModules(chunk, chunkGraph)).filter(module => module.type === MODULE_TYPE);
+
+        const renderedModules = Array.from(
+        /** @type {CssModule[]} */
+        this.getChunkModules(chunk, chunkGraph)).filter(module => module.type === MODULE_TYPE);
         const filenameTemplate =
-        /** @type {TODO} */
+        /** @type {string} */
         chunk.canBeInitial() ? this.options.filename : this.options.chunkFilename;
@@ -672,5 +757,3 @@
           result.push({
-            render: () => this.renderContentAsset(compiler, compilation, chunk, renderedModules, compilation.runtimeTemplate.requestShortener,
-            /** @type {string} */
-            filenameTemplate, {
+            render: () => this.renderContentAsset(compiler, compilation, chunk, renderedModules, compilation.runtimeTemplate.requestShortener, filenameTemplate, {
               contentHashType: MODULE_TYPE,
@@ -695,3 +778,3 @@ chunk
         const modules = this.sortModules(compilation, chunk,
-        /** @type {Iterable<Module>} */
+        /** @type {CssModule[]} */
         chunkGraph.getChunkModulesIterableBySourceType(chunk, MODULE_TYPE), compilation.runtimeTemplate.requestShortener);
@@ -824,3 +907,3 @@
          * @param {Chunk} referencedChunk
-         * @returns {any}
+         * @returns {TODO}
          */
@@ -856,5 +939,5 @@ referencedChunk => {
    * @param {Chunk} chunk
-   * @param {Iterable<Module>} modules
+   * @param {CssModule[]} modules
    * @param {Compilation["requestShortener"]} requestShortener
-   * @returns {Set<Module & { content: Buffer, media: string, sourceMap?: Buffer, supports?: string, layer?: string }>}
+   * @returns {Set<CssModule>}
    */
@@ -867,6 +950,8 @@
     if (usedModules || !modules) {
-      // @ts-ignore
-      return usedModules;
+      return (
+        /** @type {Set<CssModule>} */
+        usedModules
+      );
     }
-    /** @type {Module[]} */
+    /** @type {CssModule[]} */
 
@@ -876,8 +961,8 @@
 
-    /** @type {Map<Module, Set<Module>>} */
+    /** @type {Map<CssModule, Set<CssModule>>} */
 
     const moduleDependencies = new Map(modulesList.map(m => [m,
-    /** @type {Set<Module>} */
+    /** @type {Set<CssModule>} */
     new Set()]));
-    /** @type {Map<Module, Map<Module, Set<ChunkGroup>>>} */
+    /** @type {Map<CssModule, Map<CssModule, Set<ChunkGroup>>>} */
 
@@ -888,3 +973,3 @@ const moduleDependenciesReasons = new Map(modulesList.map(m => [m, new Map()])); // Get ordered list of modules per chunk group
 
-    /** @type {Module[][]} */
+    /** @type {CssModule[][]} */
 
@@ -903,3 +988,3 @@ const modulesByChunkGroup = Array.from(chunk.groupsIterable, chunkGroup => {
         const reasons =
-        /** @type {Map<Module, Set<ChunkGroup>>} */
+        /** @type {Map<CssModule, Set<ChunkGroup>>} */
         moduleDependenciesReasons.get(sortedModules[i]);
@@ -909,3 +994,3 @@
           const module = sortedModules[j];
-          /** @type {Set<Module>} */
+          /** @type {Set<CssModule>} */
 
@@ -926,3 +1011,3 @@ set.add(module);
     /**
-     * @param {Module} m
+     * @param {CssModule} m
      * @returns {boolean}
@@ -932,3 +1017,3 @@ */
     const unusedModulesFilter = m => !
-    /** @type {Set<Module>} */
+    /** @type {Set<CssModule>} */
     usedModules.has(m);
@@ -943,3 +1028,2 @@
         // skip and remove already added modules
-        // @ts-ignore
         while (list.length > 0 && usedModules.has(list[list.length - 1])) {
@@ -955,3 +1039,3 @@ list.pop();
           const failedDeps = Array.from(
-          /** @type {Set<Module>} */
+          /** @type {Set<CssModule>} */
           deps).filter(unusedModulesFilter); // store best match for fallback behavior
@@ -967,3 +1051,3 @@
             usedModules.add(
-            /** @type {Module & { content: Buffer, media: string, sourceMap?: Buffer, supports?: string, layer?: string }} */
+            /** @type {CssModule} */
             list.pop());
@@ -981,3 +1065,3 @@ success = true;
         const fallbackModule =
-        /** @type {Module[]} */
+        /** @type {CssModule[]} */
         bestMatch.pop();
@@ -987,3 +1071,3 @@
           const reasons = moduleDependenciesReasons.get(
-          /** @type {Module} */
+          /** @type {CssModule} */
           fallbackModule);
@@ -993,9 +1077,9 @@ compilation.warnings.push(
           new Error([`chunk ${chunk.name || chunk.id} [${pluginName}]`, "Conflicting order. Following module has been added:", ` * ${
-          /** @type {Module} */
+          /** @type {CssModule} */
           fallbackModule.readableIdentifier(requestShortener)}`, "despite it was not able to fulfill desired ordering with these modules:", ...
-          /** @type {Module[]} */
+          /** @type {CssModule[]} */
           bestMatchDeps.map(m => {
             const goodReasonsMap = moduleDependenciesReasons.get(m);
             const goodReasons = goodReasonsMap && goodReasonsMap.get(
-            /** @type {Module} */
+            /** @type {CssModule} */
             fallbackModule);
@@ -1005,3 +1089,3 @@ const failedChunkGroups = Array.from(
 
-            /** @type {Map<Module, Set<ChunkGroup>>} */
+            /** @type {Map<CssModule, Set<ChunkGroup>>} */
             reasons.get(m), cg => cg.name).join(", ");
@@ -1014,3 +1098,3 @@ const goodChunkGroups = goodReasons && Array.from(goodReasons, cg => cg.name).join(", ");
         usedModules.add(
-        /** @type {Module & { content: Buffer, media: string, sourceMap?: Buffer, supports?: string, layer?: string }} */
+        /** @type {CssModule} */
         fallbackModule);
@@ -1029,3 +1113,3 @@ }
    * @param {Chunk} chunk
-   * @param {Iterable<Module>} modules
+   * @param {CssModule[]} modules
    * @param {Compiler["requestShortener"]} requestShortener
@@ -1032,0 +1116,0 @@ * @param {string} filenameTemplate

dist/loader.js

@@ -44,3 +44,3 @@ "use strict";
  * @property {string} [supports]
- * @property {string} [supports]
+ * @property {string} [layer]
  * @property {Buffer} [sourceMap]
@@ -51,3 +51,3 @@ */
  * @param {string} content
- * @param {TODO} context
+ * @param {{ loaderContext: import("webpack").LoaderContext<LoaderOptions>, options: LoaderOptions, locals: {[key: string]: string } | undefined }} context
  * @returns {string}
@@ -62,3 +62,3 @@ */
       // ${Date.now()}
-      var cssReload = require(${stringifyRequest(context.context, path.join(__dirname, "hmr/hotModuleReplacement.js"))})(module.id, ${JSON.stringify({ ...context.options,
+      var cssReload = require(${stringifyRequest(context.loaderContext, path.join(__dirname, "hmr/hotModuleReplacement.js"))})(module.id, ${JSON.stringify({ ...context.options,
     locals: !!context.locals
@@ -133,9 +133,7 @@ })});
         /** @type {Dependency} */
-        dependency.identifier) || 0; // @ts-ignore
-
+        dependency.identifier) || 0;
         const CssDependency = MiniCssExtractPlugin.getCssDependency(webpack);
         /** @type {NormalModule} */
 
-        this._module.addDependency( // @ts-ignore
-        lastDep = new CssDependency(
+        this._module.addDependency(lastDep = new CssDependency(
         /** @type {Dependency} */
@@ -227,3 +225,3 @@ dependency,
     resultSource += this.hot ? hotLoader(result, {
-      context: this.context,
+      loaderContext: this,
       options,
@@ -356,3 +354,2 @@ locals
             type: null,
-            // @ts-ignore
             loader: loader.path,
@@ -359,0 +356,0 @@ options: loader.options,

package.json

 {
   "name": "mini-css-extract-plugin",
-  "version": "2.5.1",
+  "version": "2.5.2",
   "description": "extracts CSS into separate files",
@@ -5,0 +5,0 @@ "license": "MIT",

types/index.d.ts

 export = MiniCssExtractPlugin;
 declare class MiniCssExtractPlugin {
   /**
-   * @private
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssModule}
+   * @returns {CssModuleConstructor}
    */
-  private static getCssModule;
+  static getCssModule(webpack: Compiler["webpack"]): CssModuleConstructor;
   /**
-   * @private
    * @param {Compiler["webpack"]} webpack
-   * @returns {typeof CssDependency}
+   * @returns {CssDependencyConstructor}
    */
-  private static getCssDependency;
+  static getCssDependency(
+    webpack: Compiler["webpack"]
+  ): CssDependencyConstructor;
   /**
@@ -21,3 +21,3 @@ * @param {PluginOptions} [options]
    * @private
-   * @type {WeakMap<Chunk, Set<TODO>>}
+   * @type {WeakMap<Chunk, Set<CssModule>>}
    * @private
@@ -51,5 +51,5 @@ */
    * @param {Chunk} chunk
-   * @param {Iterable<Module>} modules
+   * @param {CssModule[]} modules
    * @param {Compilation["requestShortener"]} requestShortener
-   * @returns {Set<Module & { content: Buffer, media: string, sourceMap?: Buffer, supports?: string, layer?: string }>}
+   * @returns {Set<CssModule>}
    */
@@ -62,3 +62,3 @@ private sortModules;
    * @param {Chunk} chunk
-   * @param {Iterable<Module>} modules
+   * @param {CssModule[]} modules
    * @param {Compiler["requestShortener"]} requestShortener
@@ -88,2 +88,3 @@ * @param {string} filenameTemplate
     AssetInfo,
+    LoaderDependency,
     LoaderOptions,
@@ -94,5 +95,17 @@ PluginOptions,
     TODO,
+    CssModule,
+    CssModuleDependency,
+    CssModuleConstructor,
+    CssDependency,
+    CssDependencyOptions,
+    CssDependencyConstructor,
   };
 }
 type Compiler = import("webpack").Compiler;
+type CssModuleConstructor = new (dependency: CssModuleDependency) => CssModule;
+type CssDependencyConstructor = new (
+  loaderDependency: CssDependencyOptions,
+  context: string | null,
+  identifierIndex: number
+) => CssDependency;
 type PluginOptions = {
@@ -120,2 +133,3 @@ filename?: Required<Configuration>["output"]["filename"];
 /** @typedef {import("webpack").AssetInfo} AssetInfo */
+/** @typedef {import("./loader.js").Dependency} LoaderDependency */
 /**
@@ -171,2 +185,3 @@ * @typedef {Object} LoaderOptions
 type AssetInfo = import("webpack").AssetInfo;
+type LoaderDependency = import("./loader.js").Dependency;
 type LoaderOptions = {
@@ -197,1 +212,32 @@ publicPath?:
 type TODO = any;
+type CssModule = import("webpack").Module & {
+  content: Buffer;
+  media?: string | undefined;
+  sourceMap?: Buffer | undefined;
+  supports?: string | undefined;
+  layer?: string | undefined;
+  assets?:
+    | {
+        [key: string]: any;
+      }
+    | undefined;
+  assetsInfo?: Map<string, import("webpack").AssetInfo> | undefined;
+};
+type CssModuleDependency = {
+  context: string | null;
+  identifier: string;
+  identifierIndex: number;
+  content: Buffer;
+  sourceMap?: Buffer | undefined;
+  media?: string | undefined;
+  supports?: string | undefined;
+  layer?: TODO;
+  assetsInfo?: Map<string, import("webpack").AssetInfo> | undefined;
+  assets?:
+    | {
+        [key: string]: any;
+      }
+    | undefined;
+};
+type CssDependency = Dependency & CssModuleDependency;
+type CssDependencyOptions = Omit<LoaderDependency, "context">;

types/loader.d.ts

@@ -17,2 +17,3 @@ export type Schema = import("schema-utils/declarations/validate").Schema;
   supports?: string | undefined;
+  layer?: string | undefined;
   sourceMap?: Buffer | undefined;
@@ -19,0 +20,0 @@ };

No alert changes

Improved metrics

Total package byte prevSize

114417

increased by3.13%

Lines of code

2233

increased by5.53%

No dependency changes