Latest Threat Research:SANDWORM_MODE: Shai-Hulud-Style npm Worm Hijacks CI Workflows and Poisons AI Toolchains.Details →
mini-css-extract-plugin
Advanced tools
mini-css-extract-plugin - npm Package Compare versions
@@ -48,3 +48,3 @@ "use strict"; | ||
| if (document.currentScript) { | ||
| src = ( /** @type {HTMLScriptElement} */document.currentScript).src; | ||
| src = (/** @type {HTMLScriptElement} */document.currentScript).src; | ||
| } else { | ||
@@ -96,3 +96,3 @@ var scripts = document.getElementsByTagName("script"); | ||
| } | ||
| if (!isUrlRequest( /** @type {string} */url)) { | ||
| if (!isUrlRequest(/** @type {string} */url)) { | ||
| return; | ||
@@ -99,0 +99,0 @@ } |
+33
-31
@@ -217,3 +217,3 @@ "use strict"; | ||
| updateCacheModule(module) { | ||
| if (!this.content.equals( /** @type {CssModule} */module.content) || this.layer !== /** @type {CssModule} */module.layer || this.supports !== /** @type {CssModule} */module.supports || this.media !== /** @type {CssModule} */module.media || (this.sourceMap ? !this.sourceMap.equals( /** @type {Uint8Array} **/ | ||
| if (!this.content.equals(/** @type {CssModule} */module.content) || this.layer !== /** @type {CssModule} */module.layer || this.supports !== /** @type {CssModule} */module.supports || this.media !== /** @type {CssModule} */module.media || (this.sourceMap ? !this.sourceMap.equals(/** @type {Uint8Array} **/ | ||
| /** @type {CssModule} */module.sourceMap) : false) || this.assets !== /** @type {CssModule} */module.assets || this.assetsInfo !== /** @type {CssModule} */module.assetsInfo) { | ||
@@ -258,3 +258,6 @@ this._needBuild = true; | ||
| cacheable: true, | ||
| hash: this._computeHash( /** @type {string} */compilation.outputOptions.hashFunction) | ||
| hash: (/** @type {string} */ | ||
| this._computeHash(/** @type {string} */ | ||
| compilation.outputOptions.hashFunction)) | ||
| }; | ||
@@ -289,3 +292,5 @@ this.buildMeta = {}; | ||
| super.updateHash(hash, context); | ||
| hash.update( /** @type {NonNullable<Module["buildInfo"]>} */this.buildInfo.hash); | ||
| hash.update(/** @type {string} */ | ||
| /** @type {NonNullable<Module["buildInfo"]>} */ | ||
| this.buildInfo.hash); | ||
| } | ||
@@ -371,5 +376,3 @@ | ||
| if (cssDependencyCache.has(webpack)) { | ||
| return /** @type {CssDependencyConstructor} */( | ||
| cssDependencyCache.get(webpack) | ||
| ); | ||
| return /** @type {CssDependencyConstructor} */cssDependencyCache.get(webpack); | ||
| } | ||
@@ -501,3 +504,3 @@ class CssDependency extends webpack.Dependency { | ||
| constructor(options = {}) { | ||
| validate( /** @type {Schema} */schema, options, { | ||
| validate(/** @type {Schema} */schema, options, { | ||
| baseDataPath: "options" | ||
@@ -571,3 +574,3 @@ }); | ||
| if (this.options.experimentalUseImportModule) { | ||
| if (typeof ( /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */ | ||
| if (typeof (/** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */ | ||
| compiler.options.experiments.executeModule) === "undefined") { | ||
@@ -590,3 +593,3 @@ /** @type {Compiler["options"]["experiments"] & { executeModule?: boolean }} */ | ||
| if (splitChunks) { | ||
| if ( /** @type {string[]} */splitChunks.defaultSizeTypes.includes("...")) { | ||
| if (/** @type {string[]} */splitChunks.defaultSizeTypes.includes("...")) { | ||
| /** @type {string[]} */ | ||
@@ -629,3 +632,3 @@ splitChunks.defaultSizeTypes.push(MODULE_TYPE); | ||
| // eslint-disable-next-line no-undefined | ||
| undefined, new CssModule( /** @type {CssDependency} */dependency)); | ||
| undefined, new CssModule(/** @type {CssDependency} */dependency)); | ||
| } | ||
@@ -662,3 +665,3 @@ } | ||
| /** @type {CssModule[]} */ | ||
| const renderedModules = Array.from( /** @type {CssModule[]} */ | ||
| const renderedModules = Array.from(/** @type {CssModule[]} */ | ||
| this.getChunkModules(chunk, chunkGraph)).filter(module => | ||
@@ -702,3 +705,3 @@ // @ts-ignore | ||
| } = compiler.webpack.util; | ||
| const hash = createHash( /** @type {string} */hashFunction); | ||
| const hash = createHash(/** @type {string} */hashFunction); | ||
| for (const m of modules) { | ||
@@ -742,3 +745,3 @@ hash.update(chunkGraph.getModuleHash(m, chunk.runtime)); | ||
| if (module.type === MODULE_TYPE) { | ||
| obj[( /** @type {string} */chunk.id)] = 1; | ||
| obj[(/** @type {string} */chunk.id)] = 1; | ||
| break; | ||
@@ -783,3 +786,3 @@ } | ||
| } = /** @type {Compilation} */this.compilation; | ||
| const chunkMap = getCssChunkObject( /** @type {Chunk} */chunk, /** @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; | ||
@@ -790,3 +793,3 @@ const withHmr = runtimeRequirements.has(RuntimeGlobals.hmrDownloadUpdateHandlers); | ||
| } | ||
| const conditionMap = /** @type {ChunkGraph} */chunkGraph.getChunkConditionMap( /** @type {Chunk} */chunk, chunkHasCss); | ||
| const conditionMap = /** @type {ChunkGraph} */chunkGraph.getChunkConditionMap(/** @type {Chunk} */chunk, chunkHasCss); | ||
| const hasCssMatcher = compileBooleanMatcher(conditionMap); | ||
@@ -810,4 +813,4 @@ const withPrefetch = runtimeRequirements.has(RuntimeGlobals.prefetchChunkHandlers); | ||
| reject: "reject" | ||
| }) || "", 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", "", withPrefetch && withLoading && hasCssMatcher !== false ? `${RuntimeGlobals.prefetchChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId", [`if((!${RuntimeGlobals.hasOwnProperty}(installedCssChunks, chunkId) || installedCssChunks[chunkId] === undefined) && ${hasCssMatcher === true ? "true" : hasCssMatcher("chunkId")}) {`, Template.indent(["installedCssChunks[chunkId] = null;", linkPrefetch.call(Template.asString(["var link = document.createElement('link');", crossOriginLoading ? `link.crossOrigin = ${JSON.stringify(crossOriginLoading)};` : "", `if (${RuntimeGlobals.scriptNonce}) {`, Template.indent(`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`), "}", 'link.rel = "prefetch";', 'link.as = "style";', `link.href = ${RuntimeGlobals.publicPath} + ${RuntimeGlobals.require}.miniCssF(chunkId);`]), /** @type {Chunk} */chunk), "document.head.appendChild(link);"]), "}"])};` : "// no prefetching", "", withPreload && withLoading && hasCssMatcher !== false ? `${RuntimeGlobals.preloadChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId", [`if((!${RuntimeGlobals.hasOwnProperty}(installedCssChunks, chunkId) || installedCssChunks[chunkId] === undefined) && ${hasCssMatcher === true ? "true" : hasCssMatcher("chunkId")}) {`, Template.indent(["installedCssChunks[chunkId] = null;", linkPreload.call(Template.asString(["var link = document.createElement('link');", "link.charset = 'utf-8';", `if (${RuntimeGlobals.scriptNonce}) {`, Template.indent(`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`), "}", 'link.rel = "preload";', 'link.as = "style";', `link.href = ${RuntimeGlobals.publicPath} + ${RuntimeGlobals.require}.miniCssF(chunkId);`, crossOriginLoading ? crossOriginLoading === "use-credentials" ? 'link.crossOrigin = "use-credentials";' : Template.asString(["if (link.href.indexOf(window.location.origin + '/') !== 0) {", Template.indent(`link.crossOrigin = ${JSON.stringify(crossOriginLoading)};`), "}"]) : ""]), /** @type {Chunk} */chunk), "document.head.appendChild(link);"]), "}"])};` : "// no preloaded"]); | ||
| }) || "", 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", "", withPrefetch && withLoading && hasCssMatcher !== false ? `${RuntimeGlobals.prefetchChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId", [`if((!${RuntimeGlobals.hasOwnProperty}(installedCssChunks, chunkId) || installedCssChunks[chunkId] === undefined) && ${hasCssMatcher === true ? "true" : hasCssMatcher("chunkId")}) {`, Template.indent(["installedCssChunks[chunkId] = null;", linkPrefetch.call(Template.asString(["var link = document.createElement('link');", crossOriginLoading ? `link.crossOrigin = ${JSON.stringify(crossOriginLoading)};` : "", `if (${RuntimeGlobals.scriptNonce}) {`, Template.indent(`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`), "}", 'link.rel = "prefetch";', 'link.as = "style";', `link.href = ${RuntimeGlobals.publicPath} + ${RuntimeGlobals.require}.miniCssF(chunkId);`]), /** @type {Chunk} */chunk), "document.head.appendChild(link);"]), "}"])};` : "// no prefetching", "", withPreload && withLoading && hasCssMatcher !== false ? `${RuntimeGlobals.preloadChunkHandlers}.miniCss = ${runtimeTemplate.basicFunction("chunkId", [`if((!${RuntimeGlobals.hasOwnProperty}(installedCssChunks, chunkId) || installedCssChunks[chunkId] === undefined) && ${hasCssMatcher === true ? "true" : hasCssMatcher("chunkId")}) {`, Template.indent(["installedCssChunks[chunkId] = null;", linkPreload.call(Template.asString(["var link = document.createElement('link');", "link.charset = 'utf-8';", `if (${RuntimeGlobals.scriptNonce}) {`, Template.indent(`link.setAttribute("nonce", ${RuntimeGlobals.scriptNonce});`), "}", 'link.rel = "preload";', 'link.as = "style";', `link.href = ${RuntimeGlobals.publicPath} + ${RuntimeGlobals.require}.miniCssF(chunkId);`, crossOriginLoading ? crossOriginLoading === "use-credentials" ? 'link.crossOrigin = "use-credentials";' : Template.asString(["if (link.href.indexOf(window.location.origin + '/') !== 0) {", Template.indent(`link.crossOrigin = ${JSON.stringify(crossOriginLoading)};`), "}"]) : ""]), /** @type {Chunk} */chunk), "document.head.appendChild(link);"]), "}"])};` : "// no preloaded"]); | ||
| } | ||
@@ -840,3 +843,3 @@ } | ||
| return referencedChunk.canBeInitial() ? this.options.filename : this.options.chunkFilename; | ||
| }, false)); | ||
| }, set.has(RuntimeGlobals.hmrDownloadUpdateHandlers))); | ||
| compilation.addRuntimeModule(chunk, new CssLoadingRuntimeModule(set, this.runtimeOptions)); | ||
@@ -879,3 +882,3 @@ }; | ||
| /** @type {Map<CssModule, Set<CssModule>>} */ | ||
| const moduleDependencies = new Map(modulesList.map(m => [m, ( /** @type {Set<CssModule>} */ | ||
| const moduleDependencies = new Map(modulesList.map(m => [m, (/** @type {Set<CssModule>} */ | ||
| new Set())])); | ||
@@ -896,3 +899,3 @@ /** @type {Map<CssModule, Map<CssModule, Set<ChunkGroup>>>} */ | ||
| // eslint-disable-next-line no-undefined | ||
| .filter(item => item.index !== undefined).sort((a, b) => /** @type {number} */b.index - ( /** @type {number} */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++) { | ||
@@ -907,3 +910,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); | ||
@@ -923,3 +926,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) { | ||
@@ -942,3 +945,3 @@ let success = false; | ||
| // determine dependencies that are not yet included | ||
| const failedDeps = Array.from( /** @type {Set<CssModule>} */ | ||
| const failedDeps = Array.from(/** @type {Set<CssModule>} */ | ||
| deps).filter(unusedModulesFilter); | ||
@@ -953,3 +956,3 @@ | ||
| // use this module and remove it from list | ||
| usedModules.add( /** @type {CssModule} */list.pop()); | ||
| usedModules.add(/** @type {CssModule} */list.pop()); | ||
| success = true; | ||
@@ -966,10 +969,9 @@ break; | ||
| if (!this.options.ignoreOrder) { | ||
| const reasons = moduleDependenciesReasons.get( /** @type {CssModule} */fallbackModule); | ||
| compilation.warnings.push( /** @type {WebpackError} */ | ||
| const reasons = moduleDependenciesReasons.get(/** @type {CssModule} */fallbackModule); | ||
| compilation.warnings.push(/** @type {WebpackError} */ | ||
| new Error([`chunk ${chunk.name || chunk.id} [${pluginName}]`, "Conflicting order. Following module has been added:", ` * ${ | ||
| /** @type {CssModule} */fallbackModule.readableIdentifier(requestShortener)}`, "despite it was not able to fulfill desired ordering with these modules:", ... /** @type {CssModule[]} */bestMatchDeps.map(m => { | ||
| new Error([`chunk ${chunk.name || chunk.id} [${pluginName}]`, "Conflicting order. Following module has been added:", ` * ${/** @type {CssModule} */fallbackModule.readableIdentifier(requestShortener)}`, "despite it was not able to fulfill desired ordering with these modules:", ... /** @type {CssModule[]} */bestMatchDeps.map(m => { | ||
| const goodReasonsMap = moduleDependenciesReasons.get(m); | ||
| const goodReasons = goodReasonsMap && goodReasonsMap.get( /** @type {CssModule} */fallbackModule); | ||
| const failedChunkGroups = Array.from( /** @type {Set<ChunkGroup>} */ | ||
| const goodReasons = goodReasonsMap && goodReasonsMap.get(/** @type {CssModule} */fallbackModule); | ||
| const failedChunkGroups = Array.from(/** @type {Set<ChunkGroup>} */ | ||
@@ -982,3 +984,3 @@ /** @type {Map<CssModule, Set<ChunkGroup>>} */ | ||
| } | ||
| usedModules.add( /** @type {CssModule} */fallbackModule); | ||
| usedModules.add(/** @type {CssModule} */fallbackModule); | ||
| } | ||
@@ -985,0 +987,0 @@ } |
+11
-11
@@ -84,3 +84,3 @@ "use strict"; | ||
| // @ts-ignore | ||
| const options = this.getOptions( /** @type {Schema} */schema); | ||
| const options = this.getOptions(/** @type {Schema} */schema); | ||
| const emit = typeof options.emit !== "undefined" ? options.emit : true; | ||
@@ -120,14 +120,14 @@ const callback = this.async(); | ||
| for (const dependency of dependencies) { | ||
| if (!( /** @type {Dependency} */dependency.identifier) || !emit) { | ||
| if (!(/** @type {Dependency} */dependency.identifier) || !emit) { | ||
| // eslint-disable-next-line no-continue | ||
| continue; | ||
| } | ||
| const count = identifierCountMap.get( /** @type {Dependency} */dependency.identifier) || 0; | ||
| const count = identifierCountMap.get(/** @type {Dependency} */dependency.identifier) || 0; | ||
| const CssDependency = MiniCssExtractPlugin.getCssDependency(webpack); | ||
| /** @type {NormalModule} */ | ||
| this._module.addDependency(lastDep = new CssDependency( /** @type {Dependency} */ | ||
| this._module.addDependency(lastDep = new CssDependency(/** @type {Dependency} */ | ||
| dependency, /** @type {Dependency} */ | ||
| dependency.context, count)); | ||
| identifierCountMap.set( /** @type {Dependency} */ | ||
| identifierCountMap.set(/** @type {Dependency} */ | ||
| dependency.identifier, count + 1); | ||
@@ -195,3 +195,3 @@ } | ||
| } catch (e) { | ||
| callback( /** @type {Error} */e); | ||
| callback(/** @type {Error} */e); | ||
| return; | ||
@@ -210,3 +210,3 @@ } | ||
| }()); | ||
| const localsString = identifiers.map(([id, key]) => `\nvar ${id} = ${stringifyLocal( /** @type {Locals} */locals[key])};`).join(""); | ||
| const localsString = identifiers.map(([id, key]) => `\nvar ${id} = ${stringifyLocal(/** @type {Locals} */locals[key])};`).join(""); | ||
| const exportsString = `export { ${identifiers.map(([id, key]) => `${id} as ${JSON.stringify(key)}`).join(", ")} }`; | ||
@@ -258,3 +258,3 @@ return defaultExport ? `${localsString}\n${exportsString}\nexport default { ${identifiers.map(([id, key]) => `${JSON.stringify(key)}: ${id}`).join(", ")} }\n` : `${localsString}\n${exportsString}\n`; | ||
| layer: options.layer, | ||
| publicPath: ( /** @type {string} */publicPathForExtract), | ||
| publicPath: (/** @type {string} */publicPathForExtract), | ||
| baseUri: `${BASE_URI}/` | ||
@@ -378,4 +378,4 @@ }, | ||
| } | ||
| if ( /** @type {Compilation} */compilation.errors.length > 0) { | ||
| callback( /** @type {Compilation} */compilation.errors[0]); | ||
| if (/** @type {Compilation} */compilation.errors.length > 0) { | ||
| callback(/** @type {Compilation} */compilation.errors[0]); | ||
| return; | ||
@@ -410,3 +410,3 @@ } | ||
| } catch (e) { | ||
| callback( /** @type {Error} */e); | ||
| callback(/** @type {Error} */e); | ||
| return; | ||
@@ -413,0 +413,0 @@ } |
+2
-2
| { | ||
| "name": "mini-css-extract-plugin", | ||
| "version": "2.9.2", | ||
| "version": "2.9.3", | ||
| "description": "extracts CSS into separate files", | ||
@@ -25,3 +25,2 @@ "license": "MIT", | ||
| "build": "npm-run-all -p \"build:**\"", | ||
| "postbuild": "es-check es5 dist/hmr/hotModuleReplacement.js", | ||
| "clean": "del-cli dist", | ||
@@ -33,2 +32,3 @@ "commitlint": "commitlint --from=master", | ||
| "lint:types": "tsc --pretty --noEmit", | ||
| "lint:es-check": "es-check es5 dist/hmr/hotModuleReplacement.js", | ||
| "lint": "npm-run-all -l -p \"lint:**\"", | ||
@@ -35,0 +35,0 @@ "fix:js": "npm run lint:js -- --fix", |
+40
-32
@@ -18,3 +18,3 @@ <div align="center"> | ||
| This plugin extracts CSS into separate files. It creates a CSS file per JS file which contains CSS. It supports On-Demand-Loading of CSS and SourceMaps. | ||
| This plugin extracts CSS into separate files. It creates a CSS file for each JS file that contains CSS. It supports On-Demand-Loading of CSS and SourceMaps. | ||
@@ -52,3 +52,3 @@ It builds on top of a new webpack v5 feature and requires webpack 5 to work. | ||
| Then add the loader and the plugin to your `webpack` config. For example: | ||
| Then add the loader and the plugin to your `webpack` configuration. For example: | ||
@@ -89,3 +89,3 @@ **style.css** | ||
| > | ||
| > Note that if you import CSS from your webpack entrypoint or import styles in the [initial](https://webpack.js.org/concepts/under-the-hood/#chunks) chunk, `mini-css-extract-plugin` will not load this CSS into the page. Please use [`html-webpack-plugin`](https://github.com/jantimon/html-webpack-plugin) for automatic generation `link` tags or create `index.html` file with `link` tag. | ||
| > Note that if you import CSS from your webpack entrypoint or import styles in the [initial](https://webpack.js.org/concepts/under-the-hood/#chunks) chunk, `mini-css-extract-plugin` will not load this CSS into the page automatically. Please use [`html-webpack-plugin`](https://github.com/jantimon/html-webpack-plugin) for automatic generation `link` tags or manually include a `<link>` tag in your `index.html` file. | ||
@@ -135,3 +135,3 @@ > [!WARNING] | ||
| Default: `based on filename` | ||
| Default: `Based on filename` | ||
@@ -155,3 +155,3 @@ > Specifying `chunkFilename` as a `function` is only available in webpack@5 | ||
| Remove Order Warnings. | ||
| See [examples](#remove-order-warnings) below for details. | ||
| See [examples](#remove-order-warnings) for more details. | ||
@@ -172,3 +172,3 @@ #### `insert` | ||
| > | ||
| > Only for [non-initial (async)](https://webpack.js.org/concepts/under-the-hood/#chunks) chunks. | ||
| > Only applicable for [non-initial (async)](https://webpack.js.org/concepts/under-the-hood/#chunks) chunks. | ||
@@ -181,3 +181,3 @@ By default, the `mini-css-extract-plugin` appends styles (`<link>` elements) to `document.head` of the current `window`. | ||
| If you target an [iframe](https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement) make sure that the parent document has sufficient access rights to reach into the frame document and append elements to it. | ||
| If you target an [iframe](https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement), make sure that the parent document has sufficient access rights to reach into the frame document and append elements to it. | ||
@@ -197,3 +197,3 @@ ##### `string` | ||
| A new `<link>` element will be inserted after the element with id `some-element`. | ||
| A new `<link>` tag will be inserted after the element with the ID `some-element`. | ||
@@ -205,3 +205,3 @@ ##### `function` | ||
| > ⚠ Do not forget that this code will run in the browser alongside your application. Since not all browsers support latest ECMA features like `let`, `const`, `arrow function expression` and etc we recommend you to use only ECMA 5 features and syntax. | ||
| > | ||
| > > ⚠ The `insert` function is serialized to string and passed to the plugin. This means that it won't have access to the scope of the webpack configuration module. | ||
@@ -222,3 +222,3 @@ | ||
| A new `<link>` element will be inserted before the element with id `some-element`. | ||
| A new `<link>` tag will be inserted before the element with the ID `some-element`. | ||
@@ -237,3 +237,3 @@ #### `attributes` | ||
| > | ||
| > Only for [non-initial (async)](https://webpack.js.org/concepts/under-the-hood/#chunks) chunks. | ||
| > Only applies to [non-initial (async)](https://webpack.js.org/concepts/under-the-hood/#chunks) chunks. | ||
@@ -269,3 +269,4 @@ If defined, the `mini-css-extract-plugin` will attach given attributes with their values on `<link>` element. | ||
| > | ||
| > It's only applied to dynamically loaded css chunks, if you want to modify link attributes inside html file, please using [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) | ||
| > It's only applied to dynamically loaded CSS chunks. | ||
| > If you want to modify `<link>` attributes inside HTML file, please use [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) | ||
@@ -312,3 +313,3 @@ #### `linkType` | ||
| `false` disables the link `type` attribute | ||
| `false` disables the link `type` attribute entirely. | ||
@@ -388,6 +389,5 @@ **webpack.config.js** | ||
| Use a new webpack API to execute modules instead of child compilers. | ||
| This improves performance and memory usage a lot. | ||
| Use a new webpack API to execute modules instead of child compilers, significantly improving performance and memory usage. | ||
| When combined with `experiments.layers`, this adds a `layer` option to the loader options to specify the layer of the css execution. | ||
| When combined with `experiments.layers`, this adds a `layer` option to the loader options to specify the layer of the CSS execution. | ||
@@ -523,3 +523,4 @@ **webpack.config.js** | ||
| If true, emits a file (writes a file to the filesystem). If false, the plugin will extract the CSS but **will not** emit the file. | ||
| If `true`, emits a file (writes a file to the filesystem). | ||
| If `false`, the plugin will extract the CSS but **will not** emit the file. | ||
| It is often useful to disable this option for server-side packages. | ||
@@ -628,7 +629,6 @@ | ||
| For `production` builds it's recommended to extract the CSS from your bundle being able to use parallel loading of CSS/JS resources later on. | ||
| This can be achieved by using the `mini-css-extract-plugin`, because it creates separate css files. | ||
| For `production` builds, it is recommended to extract the CSS from your bundle being able to use parallel loading of CSS/JS resources later on. This can be achieved by using the `mini-css-extract-plugin`, because it creates separate css files. | ||
| For `development` mode (including `webpack-dev-server`) you can use [style-loader](https://github.com/webpack-contrib/style-loader), because it injects CSS into the DOM using multiple <style></style> and works faster. | ||
| > Do not use `style-loader` and `mini-css-extract-plugin` together. | ||
| > Important: Do not use `style-loader` and `mini-css-extract-plugin` together. | ||
@@ -703,3 +703,3 @@ **webpack.config.js** | ||
| > ⚠ It is not allowed to use JavaScript reserved words in css class names. | ||
| > ⚠ It is not allowed to use JavaScript reserved words in CSS class names. | ||
@@ -763,2 +763,4 @@ > ⚠ Options `esModule` and `modules.namedExport` in `css-loader` should be enabled. | ||
| You can specify `publicPath` as a function to dynamically determine the public path based on each resource’s location relative to the project root or context. | ||
| **webpack.config.js** | ||
@@ -857,3 +859,3 @@ | ||
| The `mini-css-extract-plugin` supports hot reloading of actual css files in development. | ||
| The `mini-css-extract-plugin` supports hot reloading of actual CSS files in development. | ||
| Some options are provided to enable HMR of both standard stylesheets and locally scoped CSS or CSS modules. | ||
@@ -930,3 +932,4 @@ Below is an example configuration of mini-css for HMR use with CSS modules. | ||
| minimizer: [ | ||
| // For webpack@5 you can use the `...` syntax to extend existing minimizers (i.e. `terser-webpack-plugin`), uncomment the next line | ||
| // For webpack@5 you can use the `...` syntax to extend existing minimizers (i.e. `terser-webpack-plugin`). | ||
| // Uncomment the next line o keep JS minimizers and add CSS minimizer: | ||
| // `...`, | ||
@@ -939,15 +942,17 @@ new CssMinimizerPlugin(), | ||
| This will enable CSS optimization only in production mode. If you want to run it also in development set the `optimization.minimize` option to true. | ||
| - By default, CSS minimization runs in production mode. | ||
| - If you want to run it also in development set the `optimization.minimize` option to `true`. | ||
| ### Using preloaded or inlined CSS | ||
| The runtime code detects already added CSS via `<link>` or `<style>` tag. | ||
| This can be useful when injecting CSS on server-side for Server-Side-Rendering. | ||
| The `href` of the `<link>` tag has to match the URL that will be used for loading the CSS chunk. | ||
| The `data-href` attribute can be used for `<link>` and `<style>` too. | ||
| When inlining CSS `data-href` must be used. | ||
| The runtime code detects already added CSS via `<link>` or `<style>` tags and avoids duplicating CSS loading. | ||
| - This can be useful when injecting CSS on server-side for Server-Side-Rendering (SSR). | ||
| - The `href` of the `<link>` tag has to match the URL that will be used for loading the CSS chunk. | ||
| - The `data-href` attribute can be used for both `<link>` and `<style>` elements. | ||
| - When inlining CSS `data-href` must be used. | ||
| ### Extracting all CSS in a single file | ||
| The CSS can be extracted in one CSS file using `optimization.splitChunks.cacheGroups`. | ||
| The CSS can be extracted in one CSS file using `optimization.splitChunks.cacheGroups` with the `type` `"css/mini-extract"`. | ||
@@ -1100,3 +1105,3 @@ **webpack.config.js** | ||
| For projects where css ordering has been mitigated through consistent use of scoping or naming conventions, such as [CSS Modules](https://github.com/css-modules/css-modules), the css order warnings can be disabled by setting the ignoreOrder flag to true for the plugin. | ||
| For projects where CSS ordering has been mitigated through consistent use of scoping or naming conventions, such as [CSS Modules](https://github.com/css-modules/css-modules), the css order warnings can be disabled by setting the ignoreOrder flag to true for the plugin. | ||
@@ -1127,2 +1132,4 @@ **webpack.config.js** | ||
| Switch themes by conditionally loading different SCSS variants with query parameters. | ||
| **webpack.config.js** | ||
@@ -1300,3 +1307,4 @@ | ||
| Please take a moment to read our contributing guidelines if you haven't yet done so. | ||
| We welcome all contributions! | ||
| If you're new here, please take a moment to review our contributing guidelines before submitting issues or pull requests. | ||
@@ -1303,0 +1311,0 @@ [CONTRIBUTING](./.github/CONTRIBUTING.md) |
New alerts
Debug access
Supply chain riskUses debug, reflection and dynamic code execution features.
Found 1 instance in 1 package
Dynamic require
Supply chain riskDynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
Debug access
Supply chain riskUses debug, reflection and dynamic code execution features.
Found 1 instance in 1 package
Dynamic require
Supply chain riskDynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
134241
0.47%- Lines of code
2646
0.08%- Number of lines in readme file
1305
0.62%Worsened metrics
- Number of low supply chain risk alerts
8
100%No dependency changes