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

Comparing version 2.7.6 to 2.7.7

dist/hmr/hotModuleReplacement.js

@@ -48,3 +48,3 @@ "use strict";
     if (document.currentScript) {
-      src = /** @type {HTMLScriptElement} */document.currentScript.src;
+      src = ( /** @type {HTMLScriptElement} */document.currentScript).src;
     } else {
@@ -51,0 +51,0 @@ var scripts = document.getElementsByTagName("script");

dist/index.js

@@ -126,4 +126,3 @@ "use strict";
     if (cssModuleCache.has(webpack)) {
-      return (/** @type {CssModuleConstructor} */cssModuleCache.get(webpack)
-      );
+      return /** @type {CssModuleConstructor} */cssModuleCache.get(webpack);
     }
@@ -272,3 +271,3 @@ class CssModule extends webpack.Module {
         super.updateHash(hash, context);
-        hash.update(this.buildInfo.hash);
+        hash.update( /** @type {NonNullable<Module["buildInfo"]>} */this.buildInfo.hash);
       }
@@ -354,3 +353,3 @@
     if (cssDependencyCache.has(webpack)) {
-      return (/** @type {CssDependencyConstructor} */
+      return /** @type {CssDependencyConstructor} */(
         cssDependencyCache.get(webpack)
@@ -535,4 +534,4 @@ );
     if (this.options.experimentalUseImportModule) {
-      if (typeof /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */
-      compiler.options.experiments.executeModule === "undefined") {
+      if (typeof ( /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */
+      compiler.options.experiments.executeModule) === "undefined") {
         /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */
@@ -702,3 +701,3 @@ // eslint-disable-next-line no-param-reassign
             if (module.type === MODULE_TYPE) {
-              obj[/** @type {string} */chunk.id] = 1;
+              obj[( /** @type {string} */chunk.id)] = 1;
               break;
@@ -730,4 +729,4 @@ }
             }
-          } = this.compilation;
-          const chunkMap = getCssChunkObject(chunk, this.compilation);
+          } = /** @type {Compilation} */this.compilation;
+          const chunkMap = getCssChunkObject( /** @type {Chunk} */chunk, /** @type {Compilation} */this.compilation);
           const withLoading = runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers) && Object.keys(chunkMap).length > 0;
@@ -741,4 +740,6 @@ const withHmr = runtimeRequirements.has(RuntimeGlobals.hmrDownloadUpdateHandlers);
             return `linkTag.setAttribute(${JSON.stringify(key)}, ${JSON.stringify(value)});`;
-          })) : "", 'linkTag.rel = "stylesheet";', this.runtimeOptions.linkType ? `linkTag.type = ${JSON.stringify(this.runtimeOptions.linkType)};` : "", `var onLinkComplete = ${runtimeTemplate.basicFunction("event", ["// avoid mem leaks.", "linkTag.onerror = linkTag.onload = null;", "if (event.type === 'load') {", Template.indent(["resolve();"]), "} else {", Template.indent(["var errorType = event && (event.type === 'load' ? 'missing' : event.type);", "var realHref = event && event.target && event.target.href || fullhref;", 'var err = new Error("Loading CSS chunk " + chunkId + " failed.\\n(" + realHref + ")");', 'err.code = "CSS_CHUNK_LOAD_FAILED";', "err.type = errorType;", "err.request = realHref;", "if (linkTag.parentNode) linkTag.parentNode.removeChild(linkTag)", "reject(err);"]), "}"])}`, "linkTag.onerror = linkTag.onload = onLinkComplete;", "linkTag.href = fullhref;", crossOriginLoading ? Template.asString([`if (linkTag.href.indexOf(window.location.origin + '/') !== 0) {`, Template.indent(`linkTag.crossOrigin = ${JSON.stringify(crossOriginLoading)};`), "}"]) : "", typeof this.runtimeOptions.insert !== "undefined" ? typeof this.runtimeOptions.insert === "function" ? `(${this.runtimeOptions.insert.toString()})(linkTag)` : Template.asString([`var target = document.querySelector("${this.runtimeOptions.insert}");`, `target.parentNode.insertBefore(linkTag, target.nextSibling);`]) : Template.asString(["if (oldTag) {", Template.indent(["oldTag.parentNode.insertBefore(linkTag, oldTag.nextSibling);"]), "} else {", Template.indent(["document.head.appendChild(linkTag);"]), "}"]), "return linkTag;"])};`, `var findStylesheet = ${runtimeTemplate.basicFunction("href, fullhref", ['var existingLinkTags = document.getElementsByTagName("link");', "for(var i = 0; i < existingLinkTags.length; i++) {", Template.indent(["var tag = existingLinkTags[i];", 'var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");', 'if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return tag;']), "}", 'var existingStyleTags = document.getElementsByTagName("style");', "for(var i = 0; i < existingStyleTags.length; i++) {", Template.indent(["var tag = existingStyleTags[i];", 'var dataHref = tag.getAttribute("data-href");', "if(dataHref === href || dataHref === fullhref) return tag;"]), "}"])};`, `var loadStylesheet = ${runtimeTemplate.basicFunction("chunkId", `return new Promise(${runtimeTemplate.basicFunction("resolve, reject", [`var href = ${RuntimeGlobals.require}.miniCssF(chunkId);`, `var fullhref = ${RuntimeGlobals.publicPath} + href;`, "if(findStylesheet(href, fullhref)) return resolve();", "createStylesheet(chunkId, fullhref, null, resolve, reject);"])});`)}`, withLoading ? Template.asString(["// object to store loaded CSS chunks", "var installedCssChunks = {", Template.indent( /** @type {string[]} */
-          chunk.ids.map(id => `${JSON.stringify(id)}: 0`).join(",\n")), "};", "", `${RuntimeGlobals.ensureChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId, promises", [`var cssChunks = ${JSON.stringify(chunkMap)};`, "if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);", "else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {", Template.indent([`promises.push(installedCssChunks[chunkId] = loadStylesheet(chunkId).then(${runtimeTemplate.basicFunction("", "installedCssChunks[chunkId] = 0;")}, ${runtimeTemplate.basicFunction("e", ["delete installedCssChunks[chunkId];", "throw e;"])}));`]), "}"])};`]) : "// no chunk loading", "", withHmr ? Template.asString(["var oldTags = [];", "var newTags = [];", `var applyHandler = ${runtimeTemplate.basicFunction("options", [`return { dispose: ${runtimeTemplate.basicFunction("", ["for(var i = 0; i < oldTags.length; i++) {", Template.indent(["var oldTag = oldTags[i];", "if(oldTag.parentNode) oldTag.parentNode.removeChild(oldTag);"]), "}", "oldTags.length = 0;"])}, apply: ${runtimeTemplate.basicFunction("", ['for(var i = 0; i < newTags.length; i++) newTags[i].rel = "stylesheet";', "newTags.length = 0;"])} };`])}`, `${RuntimeGlobals.hmrDownloadUpdateHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkIds, removedChunks, removedModules, promises, applyHandlers, updatedModulesList", ["applyHandlers.push(applyHandler);", `chunkIds.forEach(${runtimeTemplate.basicFunction("chunkId", [`var href = ${RuntimeGlobals.require}.miniCssF(chunkId);`, `var fullhref = ${RuntimeGlobals.publicPath} + href;`, "var oldTag = findStylesheet(href, fullhref);", "if(!oldTag) return;", `promises.push(new Promise(${runtimeTemplate.basicFunction("resolve, reject", [`var tag = createStylesheet(chunkId, fullhref, oldTag, ${runtimeTemplate.basicFunction("", ['tag.as = "style";', 'tag.rel = "preload";', "resolve();"])}, reject);`, "oldTags.push(oldTag);", "newTags.push(tag);"])}));`])});`])}`]) : "// no hmr"]);
+          })) : "", 'linkTag.rel = "stylesheet";', this.runtimeOptions.linkType ? `linkTag.type = ${JSON.stringify(this.runtimeOptions.linkType)};` : "", `var onLinkComplete = ${runtimeTemplate.basicFunction("event", ["// avoid mem leaks.", "linkTag.onerror = linkTag.onload = null;", "if (event.type === 'load') {", Template.indent(["resolve();"]), "} else {", Template.indent(["var errorType = event && event.type;", "var realHref = event && event.target && event.target.href || fullhref;", 'var err = new Error("Loading CSS chunk " + chunkId + " failed.\\n(" + errorType + ": " + realHref + ")");', 'err.name = "ChunkLoadError";',
+          // TODO remove `code` in the future major release to align with webpack
+          'err.code = "CSS_CHUNK_LOAD_FAILED";', "err.type = errorType;", "err.request = realHref;", "if (linkTag.parentNode) linkTag.parentNode.removeChild(linkTag)", "reject(err);"]), "}"])}`, "linkTag.onerror = linkTag.onload = onLinkComplete;", "linkTag.href = fullhref;", crossOriginLoading ? Template.asString([`if (linkTag.href.indexOf(window.location.origin + '/') !== 0) {`, Template.indent(`linkTag.crossOrigin = ${JSON.stringify(crossOriginLoading)};`), "}"]) : "", typeof this.runtimeOptions.insert !== "undefined" ? typeof this.runtimeOptions.insert === "function" ? `(${this.runtimeOptions.insert.toString()})(linkTag)` : Template.asString([`var target = document.querySelector("${this.runtimeOptions.insert}");`, `target.parentNode.insertBefore(linkTag, target.nextSibling);`]) : Template.asString(["if (oldTag) {", Template.indent(["oldTag.parentNode.insertBefore(linkTag, oldTag.nextSibling);"]), "} else {", Template.indent(["document.head.appendChild(linkTag);"]), "}"]), "return linkTag;"])};`, `var findStylesheet = ${runtimeTemplate.basicFunction("href, fullhref", ['var existingLinkTags = document.getElementsByTagName("link");', "for(var i = 0; i < existingLinkTags.length; i++) {", Template.indent(["var tag = existingLinkTags[i];", 'var dataHref = tag.getAttribute("data-href") || tag.getAttribute("href");', 'if(tag.rel === "stylesheet" && (dataHref === href || dataHref === fullhref)) return tag;']), "}", 'var existingStyleTags = document.getElementsByTagName("style");', "for(var i = 0; i < existingStyleTags.length; i++) {", Template.indent(["var tag = existingStyleTags[i];", 'var dataHref = tag.getAttribute("data-href");', "if(dataHref === href || dataHref === fullhref) return tag;"]), "}"])};`, `var loadStylesheet = ${runtimeTemplate.basicFunction("chunkId", `return new Promise(${runtimeTemplate.basicFunction("resolve, reject", [`var href = ${RuntimeGlobals.require}.miniCssF(chunkId);`, `var fullhref = ${RuntimeGlobals.publicPath} + href;`, "if(findStylesheet(href, fullhref)) return resolve();", "createStylesheet(chunkId, fullhref, null, resolve, reject);"])});`)}`, withLoading ? Template.asString(["// object to store loaded CSS chunks", "var installedCssChunks = {", Template.indent( /** @type {string[]} */
+          ( /** @type {Chunk} */chunk.ids).map(id => `${JSON.stringify(id)}: 0`).join(",\n")), "};", "", `${RuntimeGlobals.ensureChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId, promises", [`var cssChunks = ${JSON.stringify(chunkMap)};`, "if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);", "else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {", Template.indent([`promises.push(installedCssChunks[chunkId] = loadStylesheet(chunkId).then(${runtimeTemplate.basicFunction("", "installedCssChunks[chunkId] = 0;")}, ${runtimeTemplate.basicFunction("e", ["delete installedCssChunks[chunkId];", "throw e;"])}));`]), "}"])};`]) : "// no chunk loading", "", withHmr ? Template.asString(["var oldTags = [];", "var newTags = [];", `var applyHandler = ${runtimeTemplate.basicFunction("options", [`return { dispose: ${runtimeTemplate.basicFunction("", ["for(var i = 0; i < oldTags.length; i++) {", Template.indent(["var oldTag = oldTags[i];", "if(oldTag.parentNode) oldTag.parentNode.removeChild(oldTag);"]), "}", "oldTags.length = 0;"])}, apply: ${runtimeTemplate.basicFunction("", ['for(var i = 0; i < newTags.length; i++) newTags[i].rel = "stylesheet";', "newTags.length = 0;"])} };`])}`, `${RuntimeGlobals.hmrDownloadUpdateHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkIds, removedChunks, removedModules, promises, applyHandlers, updatedModulesList", ["applyHandlers.push(applyHandler);", `chunkIds.forEach(${runtimeTemplate.basicFunction("chunkId", [`var href = ${RuntimeGlobals.require}.miniCssF(chunkId);`, `var fullhref = ${RuntimeGlobals.publicPath} + href;`, "var oldTag = findStylesheet(href, fullhref);", "if(!oldTag) return;", `promises.push(new Promise(${runtimeTemplate.basicFunction("resolve, reject", [`var tag = createStylesheet(chunkId, fullhref, oldTag, ${runtimeTemplate.basicFunction("", ['tag.as = "style";', 'tag.rel = "preload";', "resolve();"])}, reject);`, "oldTags.push(oldTag);", "newTags.push(tag);"])}));`])});`])}`]) : "// no hmr"]);
         }
@@ -800,4 +801,3 @@ }
     if (usedModules || !modules) {
-      return (/** @type {Set<CssModule>} */usedModules
-      );
+      return /** @type {Set<CssModule>} */usedModules;
     }
@@ -809,4 +809,4 @@
     /** @type {Map<CssModule, Set<CssModule>>} */
-    const moduleDependencies = new Map(modulesList.map(m => [m, /** @type {Set<CssModule>} */
-    new Set()]));
+    const moduleDependencies = new Map(modulesList.map(m => [m, ( /** @type {Set<CssModule>} */
+    new Set())]));
     /** @type {Map<CssModule, Map<CssModule, Set<ChunkGroup>>>} */
@@ -826,3 +826,3 @@ const moduleDependenciesReasons = new Map(modulesList.map(m => [m, new Map()]));
       // eslint-disable-next-line no-undefined
-      .filter(item => item.index !== undefined).sort((a, b) => b.index - a.index).map(item => item.module);
+      .filter(item => item.index !== undefined).sort((a, b) => /** @type {number} */b.index - ( /** @type {number} */a.index)).map(item => item.module);
       for (let i = 0; i < sortedModules.length; i++) {
@@ -837,3 +837,3 @@ const set = moduleDependencies.get(sortedModules[i]);
           set.add(module);
-          const reason = reasons.get(module) || /** @type {Set<ChunkGroup>} */new Set();
+          const reason = reasons.get(module) || ( /** @type {Set<ChunkGroup>} */new Set());
           reason.add(chunkGroup);
@@ -853,3 +853,3 @@ reasons.set(module, reason);
      */
-    const unusedModulesFilter = m => ! /** @type {Set<CssModule>} */usedModules.has(m);
+    const unusedModulesFilter = m => !( /** @type {Set<CssModule>} */usedModules.has(m));
     while (usedModules.size < modulesList.length) {
@@ -955,7 +955,19 @@ let success = false;
         // http://stackoverflow.com/a/14676665/1458162
-        if (module.media) {
+        if (module.media || module.supports || typeof module.layer !== "undefined") {
+          let atImportExtra = "";
+          const needLayer = typeof module.layer !== "undefined";
+          if (needLayer) {
+            atImportExtra += module.layer.length > 0 ? ` layer(${module.layer})` : " layer";
+          }
+          if (module.supports) {
+            atImportExtra += ` supports(${module.supports})`;
+          }
+          if (module.media) {
+            atImportExtra += ` ${module.media}`;
+          }
+
           // insert media into the @import
           // this is rar
           // TODO improve this and parse the CSS to support multiple medias
-          content = content.replace(/;|\s*$/, module.media);
+          content = content.replace(/;|\s*$/, `${atImportExtra};`);
         }
@@ -962,0 +974,0 @@ externalsSource.add(content);

dist/loader.js

@@ -66,3 +66,3 @@ "use strict";
 function pitch(request) {
-  if (this._compiler && this._compiler.options && this._compiler.options.experiments && this._compiler.options.experiments.css && this._module && this._module.type === "css") {
+  if (this._compiler && this._compiler.options && this._compiler.options.experiments && this._compiler.options.experiments.css && this._module && (this._module.type === "css" || this._module.type === "css/auto" || this._module.type === "css/global" || this._module.type === "css/module")) {
     this.emitWarning(new Error('You can\'t use `experiments.css` (`experiments.futureDefaults` enable built-in CSS support by default) and `mini-css-extract-plugin` together, please set `experiments.css` to `false` or set `{ type: "javascript/auto" }` for rules with `mini-css-extract-plugin` in your webpack config (now `mini-css-extract-plugin` does nothing).'));
@@ -108,3 +108,3 @@ return;
       for (const dependency of dependencies) {
-        if (! /** @type {Dependency} */dependency.identifier || !emit) {
+        if (!( /** @type {Dependency} */dependency.identifier) || !emit) {
           // eslint-disable-next-line no-continue
@@ -224,3 +224,3 @@ continue;
       layer: options.layer,
-      publicPath: /** @type {string} */publicPathForExtract,
+      publicPath: ( /** @type {string} */publicPathForExtract),
       baseUri: `${BASE_URI}/`
@@ -270,2 +270,4 @@ },
   } = webpack.node;
+
+  // @ts-ignore
   new NodeTemplatePlugin(outputOptions).apply(childCompiler);
@@ -387,3 +389,3 @@ new NodeTargetPlugin().apply(childCompiler);
 function loader(content) {
-  if (this._compiler && this._compiler.options && this._compiler.options.experiments && this._compiler.options.experiments.css && this._module && this._module.type === "css") {
+  if (this._compiler && this._compiler.options && this._compiler.options.experiments && this._compiler.options.experiments.css && this._module && (this._module.type === "css" || this._module.type === "css/auto" || this._module.type === "css/global" || this._module.type === "css/module")) {
     return content;
@@ -390,0 +392,0 @@ }

package.json

 {
   "name": "mini-css-extract-plugin",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "description": "extracts CSS into separate files",
@@ -70,3 +70,3 @@ "license": "MIT",
     "cspell": "^6.31.1",
-    "css-loader": "^6.7.4",
+    "css-loader": "^6.9.0",
     "del": "^6.0.0",
@@ -73,0 +73,0 @@ "del-cli": "^4.0.0",

No alert changes

Improved metrics

Total package byte prevSize

115484

increased by0.91%

Lines of code

2247

increased by0.63%

No dependency changes