fix(Quantum): Quantum CSS splitting loads sourcemaps on production

nchanged · nchanged · commit 3e548ccbc2d4 · 2018-08-24T19:21:42.000+02:00
diff --git a/src/core/File.ts b/src/core/File.ts
@@ -637,9 +637,11 @@ export class File {
 		const newName = joinFuseBoxPath("/", this.context.inlineCSSPath, `${fastHash(this.info.fuseBoxPath)}.map`);
 		this.contents = this.contents.replace(re, `$1${newName}$3`);
 		this.context.output.writeToOutputFolder(newName, this.sourceMap);
+
 		if (this.context.fuse && this.context.fuse.producer) {
 			const producer = this.context.fuse.producer;
-			producer.sharedSourceMaps.set(this.info.fuseBoxPath, this.sourceMap);
+			const fullName = `${this.collection.name || "default"}/${this.info.fuseBoxPath}`;
+			producer.sharedSourceMaps.set(fullName, this.sourceMap);
 		}
 	}
 
diff --git a/src/quantum/core/CSSCollection.ts b/src/quantum/core/CSSCollection.ts
@@ -1,6 +1,6 @@
 import { CSSFile } from "./CSSFile";
 import { QuantumCore } from "../plugin/QuantumCore";
-import { Concat } from "../../Utils";
+import { Concat, joinFuseBoxPath } from "../../Utils";
 import { QuantumBit } from "../plugin/QuantumBit";
 
 export class CSSCollection {
@@ -10,6 +10,7 @@ export class CSSCollection {
 	public quantumBit: QuantumBit;
 	private renderedString: string;
 	private renderedFileName: string;
+	public sourceMapsPath: string;
 	public splitCSS: boolean;
 	constructor(public core: QuantumCore) {}
 
@@ -34,7 +35,8 @@ export class CSSCollection {
 			}
 		});
 		if (this.useSourceMaps) {
-			concat.add(null, `/*# sourceMappingURL=/${this.renderedFileName}.map */`);
+			this.sourceMapsPath = joinFuseBoxPath("/", `${this.renderedFileName}.map`);
+			concat.add(null, `/*# sourceMappingURL=${this.sourceMapsPath} */`);
 		}
 		this.sourceMap = concat.sourceMap;
 		this.renderedString = concat.content.toString();
@@ -47,7 +49,7 @@ export class CSSCollection {
 
 	public setString(str: string) {
 		if (this.useSourceMaps) {
-			str += "\n/*# sourceMappingURL=/" + this.renderedFileName + ".map */";
+			str += "\n/*# sourceMappingURL=" + this.sourceMapsPath + " */";
 		}
 		this.renderedString = str;
 		return str;
diff --git a/src/quantum/plugin/BundleWriter.ts b/src/quantum/plugin/BundleWriter.ts
@@ -190,8 +190,9 @@ export class BundleWriter {
 				if (!cssCollection.splitCSS) {
 					this.core.producer.injectedCSSFiles.add(cssResultData.filename);
 				}
+
 				if (useSourceMaps) {
-					output.writeToOutputFolder(this.core.opts.getCSSSourceMapsPath(), cssCollection.sourceMap);
+					output.writeToOutputFolder(cssCollection.sourceMapsPath, cssCollection.sourceMap);
 				}
 			}
 		};

Original file line number	Diff line number	Diff line change
`@@ -637,9 +637,11 @@ export class File {`
`637`	`637`	const newName = joinFuseBoxPath("/", this.context.inlineCSSPath, `${fastHash(this.info.fuseBoxPath)}.map`);
`638`	`638`	this.contents = this.contents.replace(re, `$1${newName}$3`);
`639`	`639`	`this.context.output.writeToOutputFolder(newName, this.sourceMap);`
	`640`	`+`
`640`	`641`	`if (this.context.fuse && this.context.fuse.producer) {`
`641`	`642`	`const producer = this.context.fuse.producer;`
`642`		`- producer.sharedSourceMaps.set(this.info.fuseBoxPath, this.sourceMap);`
	`643`	+ const fullName = `${this.collection.name \|\| "default"}/${this.info.fuseBoxPath}`;
	`644`	`+ producer.sharedSourceMaps.set(fullName, this.sourceMap);`
`643`	`645`	`}`
`644`	`646`	`}`
`645`	`647`
Original file line number	Diff line number	Diff line change
`@@ -190,8 +190,9 @@ export class BundleWriter {`
`190`	`190`	`if (!cssCollection.splitCSS) {`
`191`	`191`	`this.core.producer.injectedCSSFiles.add(cssResultData.filename);`
`192`	`192`	`}`
	`193`	`+`
`193`	`194`	`if (useSourceMaps) {`
`194`		`- output.writeToOutputFolder(this.core.opts.getCSSSourceMapsPath(), cssCollection.sourceMap);`
	`195`	`+ output.writeToOutputFolder(cssCollection.sourceMapsPath, cssCollection.sourceMap);`
`195`	`196`	`}`
`196`	`197`	`}`
`197`	`198`	`};`