1 | "use strict";
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 | exports.default = exports.pluginSymbol = exports.pluginName = void 0;
|
7 |
|
8 | var _schemaUtils = require("schema-utils");
|
9 |
|
10 | var _identifier = require("webpack/lib/util/identifier");
|
11 |
|
12 | var _pluginOptions = _interopRequireDefault(require("./plugin-options.json"));
|
13 |
|
14 | var _utils = require("./utils");
|
15 |
|
16 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
17 |
|
18 |
|
19 | const pluginName = "mini-css-extract-plugin";
|
20 | exports.pluginName = pluginName;
|
21 | const pluginSymbol = Symbol(pluginName);
|
22 | exports.pluginSymbol = pluginSymbol;
|
23 | const DEFAULT_FILENAME = "[name].css";
|
24 | const TYPES = new Set([_utils.MODULE_TYPE]);
|
25 | const CODE_GENERATION_RESULT = {
|
26 | sources: new Map(),
|
27 | runtimeRequirements: new Set()
|
28 | };
|
29 |
|
30 |
|
31 |
|
32 |
|
33 | const cssModuleCache = new WeakMap();
|
34 |
|
35 |
|
36 |
|
37 |
|
38 | const cssDependencyCache = new WeakMap();
|
39 | const registered = new WeakSet();
|
40 |
|
41 | class MiniCssExtractPlugin {
|
42 | static getCssModule(webpack) {
|
43 | |
44 |
|
45 |
|
46 | if (cssModuleCache.has(webpack)) {
|
47 | return cssModuleCache.get(webpack);
|
48 | }
|
49 |
|
50 | class CssModule extends webpack.Module {
|
51 | constructor({
|
52 | context,
|
53 | identifier,
|
54 | identifierIndex,
|
55 | content,
|
56 | layer,
|
57 | supports,
|
58 | media,
|
59 | sourceMap,
|
60 | assets,
|
61 | assetsInfo
|
62 | }) {
|
63 | super(_utils.MODULE_TYPE, context);
|
64 | this.id = "";
|
65 | this._context = context;
|
66 | this._identifier = identifier;
|
67 | this._identifierIndex = identifierIndex;
|
68 | this.content = content;
|
69 | this.layer = layer;
|
70 | this.supports = supports;
|
71 | this.media = media;
|
72 | this.sourceMap = sourceMap;
|
73 | this.assets = assets;
|
74 | this.assetsInfo = assetsInfo;
|
75 | this._needBuild = true;
|
76 | }
|
77 |
|
78 |
|
79 | size() {
|
80 | return this.content.length;
|
81 | }
|
82 |
|
83 | identifier() {
|
84 | return `css|${this._identifier}|${this._identifierIndex}`;
|
85 | }
|
86 |
|
87 | readableIdentifier(requestShortener) {
|
88 | return `css ${requestShortener.shorten(this._identifier)}${this._identifierIndex ? ` (${this._identifierIndex})` : ""}`;
|
89 | }
|
90 |
|
91 |
|
92 | getSourceTypes() {
|
93 | return TYPES;
|
94 | }
|
95 |
|
96 |
|
97 | codeGeneration() {
|
98 | return CODE_GENERATION_RESULT;
|
99 | }
|
100 |
|
101 | nameForCondition() {
|
102 | const resource = this._identifier.split("!").pop();
|
103 |
|
104 | const idx = resource.indexOf("?");
|
105 |
|
106 | if (idx >= 0) {
|
107 | return resource.substring(0, idx);
|
108 | }
|
109 |
|
110 | return resource;
|
111 | }
|
112 |
|
113 | updateCacheModule(module) {
|
114 | 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) {
|
115 | this._needBuild = true;
|
116 | this.content = module.content;
|
117 | this.layer = module.layer;
|
118 | this.supports = module.supports;
|
119 | this.media = module.media;
|
120 | this.sourceMap = module.sourceMap;
|
121 | this.assets = module.assets;
|
122 | this.assetsInfo = module.assetsInfo;
|
123 | }
|
124 | }
|
125 |
|
126 |
|
127 | needRebuild() {
|
128 | return this._needBuild;
|
129 | }
|
130 |
|
131 |
|
132 | needBuild(context, callback) {
|
133 | callback(null, this._needBuild);
|
134 | }
|
135 |
|
136 | build(options, compilation, resolver, fileSystem, callback) {
|
137 | this.buildInfo = {
|
138 | assets: this.assets,
|
139 | assetsInfo: this.assetsInfo,
|
140 | cacheable: true,
|
141 | hash: this._computeHash(compilation.outputOptions.hashFunction)
|
142 | };
|
143 | this.buildMeta = {};
|
144 | this._needBuild = false;
|
145 | callback();
|
146 | }
|
147 |
|
148 | _computeHash(hashFunction) {
|
149 | const hash = webpack.util.createHash(hashFunction);
|
150 | hash.update(this.content);
|
151 |
|
152 | if (this.layer) {
|
153 | hash.update(this.layer);
|
154 | }
|
155 |
|
156 | hash.update(this.supports || "");
|
157 | hash.update(this.media || "");
|
158 | hash.update(this.sourceMap || "");
|
159 | return hash.digest("hex");
|
160 | }
|
161 |
|
162 | updateHash(hash, context) {
|
163 | super.updateHash(hash, context);
|
164 | hash.update(this.buildInfo.hash);
|
165 | }
|
166 |
|
167 | serialize(context) {
|
168 | const {
|
169 | write
|
170 | } = context;
|
171 | write(this._context);
|
172 | write(this._identifier);
|
173 | write(this._identifierIndex);
|
174 | write(this.content);
|
175 | write(this.layer);
|
176 | write(this.supports);
|
177 | write(this.media);
|
178 | write(this.sourceMap);
|
179 | write(this.assets);
|
180 | write(this.assetsInfo);
|
181 | write(this._needBuild);
|
182 | super.serialize(context);
|
183 | }
|
184 |
|
185 | deserialize(context) {
|
186 | this._needBuild = context.read();
|
187 | super.deserialize(context);
|
188 | }
|
189 |
|
190 | }
|
191 |
|
192 | cssModuleCache.set(webpack, CssModule);
|
193 | webpack.util.serialization.register(CssModule, "mini-css-extract-plugin/dist/CssModule", null, {
|
194 | serialize(instance, context) {
|
195 | instance.serialize(context);
|
196 | },
|
197 |
|
198 | deserialize(context) {
|
199 | const {
|
200 | read
|
201 | } = context;
|
202 | const contextModule = read();
|
203 | const identifier = read();
|
204 | const identifierIndex = read();
|
205 | const content = read();
|
206 | const layer = read();
|
207 | const supports = read();
|
208 | const media = read();
|
209 | const sourceMap = read();
|
210 | const assets = read();
|
211 | const assetsInfo = read();
|
212 | const dep = new CssModule({
|
213 | context: contextModule,
|
214 | identifier,
|
215 | identifierIndex,
|
216 | content,
|
217 | layer,
|
218 | supports,
|
219 | media,
|
220 | sourceMap,
|
221 | assets,
|
222 | assetsInfo
|
223 | });
|
224 | dep.deserialize(context);
|
225 | return dep;
|
226 | }
|
227 |
|
228 | });
|
229 | return CssModule;
|
230 | }
|
231 |
|
232 | static getCssDependency(webpack) {
|
233 | |
234 |
|
235 |
|
236 | if (cssDependencyCache.has(webpack)) {
|
237 | return cssDependencyCache.get(webpack);
|
238 | }
|
239 |
|
240 |
|
241 | class CssDependency extends webpack.Dependency {
|
242 | constructor({
|
243 | identifier,
|
244 | content,
|
245 | layer,
|
246 | supports,
|
247 | media,
|
248 | sourceMap
|
249 | }, context, identifierIndex) {
|
250 | super();
|
251 | this.identifier = identifier;
|
252 | this.identifierIndex = identifierIndex;
|
253 | this.content = content;
|
254 | this.layer = layer;
|
255 | this.supports = supports;
|
256 | this.media = media;
|
257 | this.sourceMap = sourceMap;
|
258 | this.context = context;
|
259 |
|
260 | this.assets = undefined;
|
261 |
|
262 | this.assetsInfo = undefined;
|
263 | }
|
264 |
|
265 | getResourceIdentifier() {
|
266 | return `css-module-${this.identifier}-${this.identifierIndex}`;
|
267 | }
|
268 |
|
269 |
|
270 | getModuleEvaluationSideEffectsState() {
|
271 | return webpack.ModuleGraphConnection.TRANSITIVE_ONLY;
|
272 | }
|
273 |
|
274 | serialize(context) {
|
275 | const {
|
276 | write
|
277 | } = context;
|
278 | write(this.identifier);
|
279 | write(this.content);
|
280 | write(this.layer);
|
281 | write(this.supports);
|
282 | write(this.media);
|
283 | write(this.sourceMap);
|
284 | write(this.context);
|
285 | write(this.identifierIndex);
|
286 | write(this.assets);
|
287 | write(this.assetsInfo);
|
288 | super.serialize(context);
|
289 | }
|
290 |
|
291 | deserialize(context) {
|
292 | super.deserialize(context);
|
293 | }
|
294 |
|
295 | }
|
296 |
|
297 | cssDependencyCache.set(webpack, CssDependency);
|
298 | webpack.util.serialization.register(CssDependency, "mini-css-extract-plugin/dist/CssDependency", null, {
|
299 | serialize(instance, context) {
|
300 | instance.serialize(context);
|
301 | },
|
302 |
|
303 | deserialize(context) {
|
304 | const {
|
305 | read
|
306 | } = context;
|
307 | const dep = new CssDependency({
|
308 | identifier: read(),
|
309 | content: read(),
|
310 | layer: read(),
|
311 | supports: read(),
|
312 | media: read(),
|
313 | sourceMap: read()
|
314 | }, read(), read());
|
315 | const assets = read();
|
316 | const assetsInfo = read();
|
317 | dep.assets = assets;
|
318 | dep.assetsInfo = assetsInfo;
|
319 | dep.deserialize(context);
|
320 | return dep;
|
321 | }
|
322 |
|
323 | });
|
324 | return CssDependency;
|
325 | }
|
326 |
|
327 | constructor(options = {}) {
|
328 | (0, _schemaUtils.validate)(_pluginOptions.default, options, {
|
329 | baseDataPath: "options"
|
330 | });
|
331 | this._sortedModulesCache = new WeakMap();
|
332 | this.options = Object.assign({
|
333 | filename: DEFAULT_FILENAME,
|
334 | ignoreOrder: false,
|
335 |
|
336 |
|
337 | experimentalUseImportModule: undefined,
|
338 | runtime: true
|
339 | }, options);
|
340 | this.runtimeOptions = {
|
341 | insert: options.insert,
|
342 | linkType:
|
343 | options.linkType === true || typeof options.linkType === "undefined" ? "text/css" : options.linkType,
|
344 | attributes: options.attributes
|
345 | };
|
346 |
|
347 | if (!this.options.chunkFilename) {
|
348 | const {
|
349 | filename
|
350 | } = this.options;
|
351 |
|
352 | if (typeof filename !== "function") {
|
353 | const hasName = filename.includes("[name]");
|
354 | const hasId = filename.includes("[id]");
|
355 | const hasChunkHash = filename.includes("[chunkhash]");
|
356 | const hasContentHash = filename.includes("[contenthash]");
|
357 |
|
358 | if (hasChunkHash || hasContentHash || hasName || hasId) {
|
359 | this.options.chunkFilename = filename;
|
360 | } else {
|
361 |
|
362 | this.options.chunkFilename = filename.replace(/(^|\/)([^/]*(?:\?|$))/, "$1[id].$2");
|
363 | }
|
364 | } else {
|
365 | this.options.chunkFilename = "[id].css";
|
366 | }
|
367 | }
|
368 | }
|
369 |
|
370 |
|
371 |
|
372 | apply(compiler) {
|
373 | const {
|
374 | webpack
|
375 | } = compiler;
|
376 |
|
377 | if (this.options.experimentalUseImportModule) {
|
378 | if (typeof compiler.options.experiments.executeModule === "undefined") {
|
379 |
|
380 | compiler.options.experiments.executeModule = true;
|
381 | }
|
382 | }
|
383 |
|
384 |
|
385 |
|
386 | if (!registered.has(webpack)) {
|
387 | registered.add(webpack);
|
388 | webpack.util.serialization.registerLoader(/^mini-css-extract-plugin\//, _utils.trueFn);
|
389 | }
|
390 |
|
391 | const {
|
392 | splitChunks
|
393 | } = compiler.options.optimization;
|
394 |
|
395 | if (splitChunks) {
|
396 | if (splitChunks.defaultSizeTypes.includes("...")) {
|
397 | splitChunks.defaultSizeTypes.push(_utils.MODULE_TYPE);
|
398 | }
|
399 | }
|
400 |
|
401 | const CssModule = MiniCssExtractPlugin.getCssModule(webpack);
|
402 | const CssDependency = MiniCssExtractPlugin.getCssDependency(webpack);
|
403 | const {
|
404 | NormalModule
|
405 | } = compiler.webpack;
|
406 | compiler.hooks.compilation.tap(pluginName, compilation => {
|
407 | const {
|
408 | loader: normalModuleHook
|
409 | } = NormalModule.getCompilationHooks(compilation);
|
410 | normalModuleHook.tap(pluginName, loaderContext => {
|
411 |
|
412 | loaderContext[pluginSymbol] = {
|
413 | experimentalUseImportModule: this.options.experimentalUseImportModule
|
414 | };
|
415 | });
|
416 | });
|
417 | compiler.hooks.thisCompilation.tap(pluginName, compilation => {
|
418 | class CssModuleFactory {
|
419 |
|
420 | create({
|
421 | dependencies: [dependency]
|
422 | }, callback) {
|
423 | callback(null, new CssModule(dependency));
|
424 | }
|
425 |
|
426 | }
|
427 |
|
428 | compilation.dependencyFactories.set(CssDependency, new CssModuleFactory());
|
429 |
|
430 | class CssDependencyTemplate {
|
431 |
|
432 | apply() {}
|
433 |
|
434 | }
|
435 |
|
436 | compilation.dependencyTemplates.set(CssDependency, new CssDependencyTemplate());
|
437 | compilation.hooks.renderManifest.tap(pluginName, (result, {
|
438 | chunk
|
439 | }) => {
|
440 | const {
|
441 | chunkGraph
|
442 | } = compilation;
|
443 | const {
|
444 | HotUpdateChunk
|
445 | } = webpack;
|
446 |
|
447 |
|
448 | if (chunk instanceof HotUpdateChunk) {
|
449 | return;
|
450 | }
|
451 |
|
452 | const renderedModules = Array.from(this.getChunkModules(chunk, chunkGraph)).filter(module => module.type === _utils.MODULE_TYPE);
|
453 | const filenameTemplate = chunk.canBeInitial() ? this.options.filename : this.options.chunkFilename;
|
454 |
|
455 | if (renderedModules.length > 0) {
|
456 | result.push({
|
457 | render: () => this.renderContentAsset(compiler, compilation, chunk, renderedModules, compilation.runtimeTemplate.requestShortener, filenameTemplate, {
|
458 | contentHashType: _utils.MODULE_TYPE,
|
459 | chunk
|
460 | }),
|
461 | filenameTemplate,
|
462 | pathOptions: {
|
463 | chunk,
|
464 | contentHashType: _utils.MODULE_TYPE
|
465 | },
|
466 | identifier: `${pluginName}.${chunk.id}`,
|
467 | hash: chunk.contentHash[_utils.MODULE_TYPE]
|
468 | });
|
469 | }
|
470 | });
|
471 | compilation.hooks.contentHash.tap(pluginName, chunk => {
|
472 | const {
|
473 | outputOptions,
|
474 | chunkGraph
|
475 | } = compilation;
|
476 | const modules = this.sortModules(compilation, chunk, chunkGraph.getChunkModulesIterableBySourceType(chunk, _utils.MODULE_TYPE), compilation.runtimeTemplate.requestShortener);
|
477 |
|
478 | if (modules) {
|
479 | const {
|
480 | hashFunction,
|
481 | hashDigest,
|
482 | hashDigestLength
|
483 | } = outputOptions;
|
484 | const {
|
485 | createHash
|
486 | } = compiler.webpack.util;
|
487 | const hash = createHash(hashFunction);
|
488 |
|
489 | for (const m of modules) {
|
490 | hash.update(chunkGraph.getModuleHash(m, chunk.runtime));
|
491 | }
|
492 |
|
493 |
|
494 | chunk.contentHash[_utils.MODULE_TYPE] = hash.digest(hashDigest).substring(0, hashDigestLength);
|
495 | }
|
496 | });
|
497 |
|
498 | if (!this.options.runtime) {
|
499 | return;
|
500 | }
|
501 |
|
502 | const {
|
503 | Template,
|
504 | RuntimeGlobals,
|
505 | RuntimeModule,
|
506 | runtime
|
507 | } = webpack;
|
508 |
|
509 | const getCssChunkObject = (mainChunk, compilation) => {
|
510 | const obj = {};
|
511 | const {
|
512 | chunkGraph
|
513 | } = compilation;
|
514 |
|
515 | for (const chunk of mainChunk.getAllAsyncChunks()) {
|
516 | const modules = chunkGraph.getOrderedChunkModulesIterable(chunk, _utils.compareModulesByIdentifier);
|
517 |
|
518 | for (const module of modules) {
|
519 | if (module.type === _utils.MODULE_TYPE) {
|
520 | obj[chunk.id] = 1;
|
521 | break;
|
522 | }
|
523 | }
|
524 | }
|
525 |
|
526 | return obj;
|
527 | };
|
528 |
|
529 | class CssLoadingRuntimeModule extends RuntimeModule {
|
530 | constructor(runtimeRequirements, runtimeOptions) {
|
531 | super("css loading", 10);
|
532 | this.runtimeRequirements = runtimeRequirements;
|
533 | this.runtimeOptions = runtimeOptions;
|
534 | }
|
535 |
|
536 | generate() {
|
537 | const {
|
538 | chunk,
|
539 | runtimeRequirements
|
540 | } = this;
|
541 | const {
|
542 | runtimeTemplate,
|
543 | outputOptions: {
|
544 | crossOriginLoading
|
545 | }
|
546 | } = this.compilation;
|
547 | const chunkMap = getCssChunkObject(chunk, this.compilation);
|
548 | const withLoading = runtimeRequirements.has(RuntimeGlobals.ensureChunkHandlers) && Object.keys(chunkMap).length > 0;
|
549 | const withHmr = runtimeRequirements.has(RuntimeGlobals.hmrDownloadUpdateHandlers);
|
550 |
|
551 | if (!withLoading && !withHmr) {
|
552 | return null;
|
553 | }
|
554 |
|
555 | return Template.asString([`var createStylesheet = ${runtimeTemplate.basicFunction("chunkId, fullhref, resolve, reject", ['var linkTag = document.createElement("link");', this.runtimeOptions.attributes ? Template.asString(Object.entries(this.runtimeOptions.attributes).map(entry => {
|
556 | const [key, value] = entry;
|
557 | return `linkTag.setAttribute(${JSON.stringify(key)}, ${JSON.stringify(value)});`;
|
558 | })) : "", '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;", "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(["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, resolve, reject);"])});`)}`, withLoading ? Template.asString(["// object to store loaded CSS chunks", "var installedCssChunks = {", Template.indent(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, ${runtimeTemplate.basicFunction("", ['tag.as = "style";', 'tag.rel = "preload";', "resolve();"])}, reject);`, "oldTags.push(oldTag);", "newTags.push(tag);"])}));`])});`])}`]) : "// no hmr"]);
|
559 | }
|
560 |
|
561 | }
|
562 |
|
563 | const enabledChunks = new WeakSet();
|
564 |
|
565 | const handler = (chunk, set) => {
|
566 | if (enabledChunks.has(chunk)) {
|
567 | return;
|
568 | }
|
569 |
|
570 | enabledChunks.add(chunk);
|
571 |
|
572 | if (typeof this.options.chunkFilename === "string" && /\[(full)?hash(:\d+)?\]/.test(this.options.chunkFilename)) {
|
573 | set.add(RuntimeGlobals.getFullHash);
|
574 | }
|
575 |
|
576 | set.add(RuntimeGlobals.publicPath);
|
577 | compilation.addRuntimeModule(chunk, new runtime.GetChunkFilenameRuntimeModule(_utils.MODULE_TYPE, "mini-css", `${RuntimeGlobals.require}.miniCssF`, referencedChunk => {
|
578 | if (!referencedChunk.contentHash[_utils.MODULE_TYPE]) {
|
579 | return false;
|
580 | }
|
581 |
|
582 | return referencedChunk.canBeInitial() ? this.options.filename : this.options.chunkFilename;
|
583 | }, true));
|
584 | compilation.addRuntimeModule(chunk, new CssLoadingRuntimeModule(set, this.runtimeOptions));
|
585 | };
|
586 |
|
587 | compilation.hooks.runtimeRequirementInTree.for(RuntimeGlobals.ensureChunkHandlers).tap(pluginName, handler);
|
588 | compilation.hooks.runtimeRequirementInTree.for(RuntimeGlobals.hmrDownloadUpdateHandlers).tap(pluginName, handler);
|
589 | });
|
590 | }
|
591 |
|
592 | getChunkModules(chunk, chunkGraph) {
|
593 | return typeof chunkGraph !== "undefined" ? chunkGraph.getOrderedChunkModulesIterable(chunk, _utils.compareModulesByIdentifier) : chunk.modulesIterable;
|
594 | }
|
595 |
|
596 | sortModules(compilation, chunk, modules, requestShortener) {
|
597 | let usedModules = this._sortedModulesCache.get(chunk);
|
598 |
|
599 | if (usedModules || !modules) {
|
600 | return usedModules;
|
601 | }
|
602 |
|
603 | const modulesList = [...modules]; // Store dependencies for modules
|
604 |
|
605 | const moduleDependencies = new Map(modulesList.map(m => [m, new Set()]));
|
606 | const moduleDependenciesReasons = new Map(modulesList.map(m => [m, new Map()])); // Get ordered list of modules per chunk group
|
607 | // This loop also gathers dependencies from the ordered lists
|
608 | // Lists are in reverse order to allow to use Array.pop()
|
609 |
|
610 | const modulesByChunkGroup = Array.from(chunk.groupsIterable, chunkGroup => {
|
611 | const sortedModules = modulesList.map(module => {
|
612 | return {
|
613 | module,
|
614 | index: chunkGroup.getModulePostOrderIndex(module)
|
615 | };
|
616 | }) // eslint-disable-next-line no-undefined
|
617 | .filter(item => item.index !== undefined).sort((a, b) => b.index - a.index).map(item => item.module);
|
618 |
|
619 | for (let i = 0; i < sortedModules.length; i++) {
|
620 | const set = moduleDependencies.get(sortedModules[i]);
|
621 | const reasons = moduleDependenciesReasons.get(sortedModules[i]);
|
622 |
|
623 | for (let j = i + 1; j < sortedModules.length; j++) {
|
624 | const module = sortedModules[j];
|
625 | set.add(module);
|
626 | const reason = reasons.get(module) || new Set();
|
627 | reason.add(chunkGroup);
|
628 | reasons.set(module, reason);
|
629 | }
|
630 | }
|
631 |
|
632 | return sortedModules;
|
633 | }); // set with already included modules in correct order
|
634 |
|
635 | usedModules = new Set();
|
636 |
|
637 | const unusedModulesFilter = m => !usedModules.has(m);
|
638 |
|
639 | while (usedModules.size < modulesList.length) {
|
640 | let success = false;
|
641 | let bestMatch;
|
642 | let bestMatchDeps; // get first module where dependencies are fulfilled
|
643 |
|
644 | for (const list of modulesByChunkGroup) {
|
645 | // skip and remove already added modules
|
646 | while (list.length > 0 && usedModules.has(list[list.length - 1])) {
|
647 | list.pop();
|
648 | } // skip empty lists
|
649 |
|
650 |
|
651 | if (list.length !== 0) {
|
652 | const module = list[list.length - 1];
|
653 | const deps = moduleDependencies.get(module); // determine dependencies that are not yet included
|
654 |
|
655 | const failedDeps = Array.from(deps).filter(unusedModulesFilter); // store best match for fallback behavior
|
656 |
|
657 | if (!bestMatchDeps || bestMatchDeps.length > failedDeps.length) {
|
658 | bestMatch = list;
|
659 | bestMatchDeps = failedDeps;
|
660 | }
|
661 |
|
662 | if (failedDeps.length === 0) {
|
663 | // use this module and remove it from list
|
664 | usedModules.add(list.pop());
|
665 | success = true;
|
666 | break;
|
667 | }
|
668 | }
|
669 | }
|
670 |
|
671 | if (!success) {
|
672 | // no module found => there is a conflict
|
673 | // use list with fewest failed deps
|
674 | // and emit a warning
|
675 | const fallbackModule = bestMatch.pop();
|
676 |
|
677 | if (!this.options.ignoreOrder) {
|
678 | const reasons = moduleDependenciesReasons.get(fallbackModule);
|
679 | compilation.warnings.push(new Error([`chunk ${chunk.name || chunk.id} [${pluginName}]`, "Conflicting order. Following module has been added:", ` * ${fallbackModule.readableIdentifier(requestShortener)}`, "despite it was not able to fulfill desired ordering with these modules:", ...bestMatchDeps.map(m => {
|
680 | const goodReasonsMap = moduleDependenciesReasons.get(m);
|
681 | const goodReasons = goodReasonsMap && goodReasonsMap.get(fallbackModule);
|
682 | const failedChunkGroups = Array.from(reasons.get(m), cg => cg.name).join(", ");
|
683 | const goodChunkGroups = goodReasons && Array.from(goodReasons, cg => cg.name).join(", ");
|
684 | return [` * ${m.readableIdentifier(requestShortener)}`, ` - couldn't fulfill desired order of chunk group(s) ${failedChunkGroups}`, goodChunkGroups && ` - while fulfilling desired order of chunk group(s) ${goodChunkGroups}`].filter(Boolean).join("\n");
|
685 | })].join("\n")));
|
686 | }
|
687 |
|
688 | usedModules.add(fallbackModule);
|
689 | }
|
690 | }
|
691 |
|
692 | this._sortedModulesCache.set(chunk, usedModules);
|
693 |
|
694 | return usedModules;
|
695 | }
|
696 |
|
697 | renderContentAsset(compiler, compilation, chunk, modules, requestShortener, filenameTemplate, pathData) {
|
698 | const usedModules = this.sortModules(compilation, chunk, modules, requestShortener);
|
699 | const {
|
700 | ConcatSource,
|
701 | SourceMapSource,
|
702 | RawSource
|
703 | } = compiler.webpack.sources;
|
704 | const source = new ConcatSource();
|
705 | const externalsSource = new ConcatSource();
|
706 |
|
707 | for (const module of usedModules) {
|
708 | let content = module.content.toString();
|
709 | const readableIdentifier = module.readableIdentifier(requestShortener);
|
710 | const startsWithAtRuleImport = /^@import url/.test(content);
|
711 | let header;
|
712 |
|
713 | if (compilation.outputOptions.pathinfo) {
|
714 |
|
715 | const reqStr = readableIdentifier.replace(/\*\//g, "*_/");
|
716 | const reqStrStar = "*".repeat(reqStr.length);
|
717 | const headerStr = `/*!****${reqStrStar}****!*\\\n !*** ${reqStr} ***!\n \\****${reqStrStar}****/\n`;
|
718 | header = new RawSource(headerStr);
|
719 | }
|
720 |
|
721 | if (startsWithAtRuleImport) {
|
722 | if (typeof header !== "undefined") {
|
723 | externalsSource.add(header);
|
724 | }
|
725 |
|
726 |
|
727 |
|
728 | if (module.media) {
|
729 |
|
730 |
|
731 |
|
732 | content = content.replace(/;|\s*$/, module.media);
|
733 | }
|
734 |
|
735 | externalsSource.add(content);
|
736 | externalsSource.add("\n");
|
737 | } else {
|
738 | if (typeof header !== "undefined") {
|
739 | source.add(header);
|
740 | }
|
741 |
|
742 | if (module.supports) {
|
743 | source.add(`@supports (${module.supports}) {\n`);
|
744 | }
|
745 |
|
746 | if (module.media) {
|
747 | source.add(`@media ${module.media} {\n`);
|
748 | }
|
749 |
|
750 | const needLayer = typeof module.layer !== "undefined";
|
751 |
|
752 | if (needLayer) {
|
753 | source.add(`@layer${module.layer.length > 0 ? ` ${module.layer}` : ""} {\n`);
|
754 | }
|
755 |
|
756 | const {
|
757 | path: filename
|
758 | } = compilation.getPathWithInfo(filenameTemplate, pathData);
|
759 | const undoPath = (0, _identifier.getUndoPath)(filename, compiler.outputPath, false);
|
760 | content = content.replace(new RegExp(_utils.ABSOLUTE_PUBLIC_PATH, "g"), "");
|
761 | content = content.replace(new RegExp(_utils.SINGLE_DOT_PATH_SEGMENT, "g"), ".");
|
762 | content = content.replace(new RegExp(_utils.AUTO_PUBLIC_PATH, "g"), undoPath);
|
763 |
|
764 | if (module.sourceMap) {
|
765 | source.add(new SourceMapSource(content, readableIdentifier, module.sourceMap.toString()));
|
766 | } else {
|
767 | source.add(new RawSource(content, readableIdentifier));
|
768 | }
|
769 |
|
770 | source.add("\n");
|
771 |
|
772 | if (needLayer) {
|
773 | source.add("}\n");
|
774 | }
|
775 |
|
776 | if (module.media) {
|
777 | source.add("}\n");
|
778 | }
|
779 |
|
780 | if (module.supports) {
|
781 | source.add("}\n");
|
782 | }
|
783 | }
|
784 | }
|
785 |
|
786 | return new ConcatSource(externalsSource, source);
|
787 | }
|
788 |
|
789 | }
|
790 |
|
791 | MiniCssExtractPlugin.loader = require.resolve("./loader");
|
792 | var _default = MiniCssExtractPlugin;
|
793 | exports.default = _default; |
\ | No newline at end of file |