Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: source maps path on windows #532

Merged
merged 2 commits into from May 22, 2017
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
21 changes: 15 additions & 6 deletions lib/loader.js
Expand Up @@ -20,8 +20,17 @@ module.exports = function(content, map) {
var resolve = createResolver(query.alias);

if(sourceMap) {
if (map && typeof map !== "string") {
map = JSON.stringify(map);
if (map) {
if (typeof map === "string") {
map = JSON.stringify(map);
}

if (map.sources) {
map.sources = map.sources.map(function (source) {
return source.replace(/\\/g, '/');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Test with path.sep? But I think it's unnecessary...

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@michael-ciniawsky yep, we should already changed \ to /

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@michael-ciniawsky This is a source map check. Can we assume forward slash there due to browser environment?

});
map.sourceRoot = '';
}
}
} else {
// Some loaders (example `"postcss-loader": "1.x.x"`) always generates source map, we should remove it
Expand All @@ -30,8 +39,8 @@ module.exports = function(content, map) {

processCss(content, map, {
mode: moduleMode ? "local" : "global",
from: loaderUtils.getRemainingRequest(this),
to: loaderUtils.getCurrentRequest(this),
from: loaderUtils.getRemainingRequest(this).split("!").pop(),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What is the output of loaderUtils.getRemainingRequest(this).split("!").pop()? If I remember right it should be the absolute file path and therefore we could replaced it with this.resourcePath instead?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Best get file from getRemainingRequest it is more safe

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

kk also not really related to this PR, just pop into my eyes

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Look into resourcePath, yup. I can't remember the exact API, though. Maybe this needs some guidelines.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@bebraw why? what is bad in use loaderUtils.getRemainingRequest(this).split("!").pop(), also #532 (comment)

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@evilebottnawi I'm not entirely sure. At least test-wise the current implementation passes. It's fine to refactor later. 👍

to: loaderUtils.getCurrentRequest(this).split("!").pop(),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should be equal to this.resourcePath aswell

query: query,
minimize: this.minimize,
loaderContext: this,
Expand Down Expand Up @@ -105,11 +114,11 @@ module.exports = function(content, map) {
map = result.map;
if(map.sources) {
map.sources = map.sources.map(function(source) {
return source.split("!").pop();
return source.split("!").pop().replace(/\\/g, '/');
}, this);
map.sourceRoot = "";
}
map.file = map.file.split("!").pop();
map.file = map.file.split("!").pop().replace(/\\/g, '/');
map = JSON.stringify(map);
moduleJs = "exports.push([module.id, " + cssAsString + ", \"\", " + map + "]);";
} else {
Expand Down
2 changes: 1 addition & 1 deletion lib/processCss.js
Expand Up @@ -48,7 +48,7 @@ var parserPlugin = postcss.plugin("css-loader-parser", function(options) {
url = url.url;
} else if(url.type === "string") {
url = url.value;
} else throw rule.error("Unexpected format" + rule.params);
} else throw rule.error("Unexpected format " + rule.params);
if (!url.replace(/\s/g, '').length) {
return;
}
Expand Down
102 changes: 86 additions & 16 deletions test/sourceMapTest.js
Expand Up @@ -10,27 +10,78 @@ describe("source maps", function() {
testWithMap("falsy: undefined map doesn't cause an error", ".class { a: b c d; }", undefined, [
[1, ".class { a: b c d; }", ""]
]);
testWithMap("should don't generate sourceMap when `sourceMap: false` and map exist",
testWithMap("should don't generate sourceMap when `sourceMap: false` and map exists",
".class { a: b c d; }",
{
{
file: 'test.css',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.css' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
},
[
[1, ".class { a: b c d; }", ""]
],
{
sourceMap: false
}
);
testWithMap("should don't generate sourceMap when `sourceMap: true` and map exists",
".class { a: b c d; }",
{
file: 'test.css',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.css' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
},
[
[1, ".class { a: b c d; }", "", {
file: 'test.css',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.css' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
}]
],
{
sourceMap: true
}
);
testWithMap("should don't generate sourceMap when `sourceMap: true` and map exists and string",
".class { a: b c d; }",
JSON.stringify({
file: 'test.css',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.css' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
},
[
[1, ".class { a: b c d; }", ""]
],
{
query: "?sourceMap=false"
}
);
}),
[
[1, ".class { a: b c d; }", "", {
file: 'test.css',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.css' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
}]
],
{
sourceMap: true
}
);
testMap("generate sourceMap (1 loader)", ".class { a: b c d; }", undefined, {
loaders: [{request: "/path/css-loader"}],
options: { context: "/" },
resource: "/folder/test.css",
request: "/path/css-loader!/folder/test.css",
query: "?sourceMap"
Expand All @@ -47,7 +98,6 @@ describe("source maps", function() {
]);
testMap("generate sourceMap (1 loader, relative)", ".class { a: b c d; }", undefined, {
loaders: [{request: "/path/css-loader"}],
options: { context: "/other-folder/sub" },
resource: "/folder/test.css",
request: "/path/css-loader!/folder/test.css",
query: "?sourceMap"
Expand All @@ -64,7 +114,6 @@ describe("source maps", function() {
]);
testMap("generate sourceMap (1 loader, data url)", ".class { background-image: url(\"data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 26' fill='%23007aff'><rect width='4' height='4'/><rect x='8' y='1' width='34' height='2'/><rect y='11' width='4' height='4'/><rect x='8' y='12' width='34' height='2'/><rect y='22' width='4' height='4'/><rect x='8' y='23' width='34' height='2'/></svg>\"); }", undefined, {
loaders: [{request: "/path/css-loader"}],
options: { context: "/" },
resource: "/folder/test.css",
request: "/path/css-loader!/folder/test.css",
query: "?sourceMap"
Expand All @@ -81,7 +130,6 @@ describe("source maps", function() {
]);
testMap("generate sourceMap (1 loader, encoded data url)", ".class { background-image: url(\"data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2042%2026%27%20fill%3D%27%23007aff%27%3E%3Crect%20width%3D%274%27%20height%3D%274%27%2F%3E%3Crect%20x%3D%278%27%20y%3D%271%27%20width%3D%2734%27%20height%3D%272%27%2F%3E%3Crect%20y%3D%2711%27%20width%3D%274%27%20height%3D%274%27%2F%3E%3Crect%20x%3D%278%27%20y%3D%2712%27%20width%3D%2734%27%20height%3D%272%27%2F%3E%3Crect%20y%3D%2722%27%20width%3D%274%27%20height%3D%274%27%2F%3E%3Crect%20x%3D%278%27%20y%3D%2723%27%20width%3D%2734%27%20height%3D%272%27%2F%3E%3C%2Fsvg%3E\"); }", undefined, {
loaders: [{request: "/path/css-loader"}],
options: { context: "/" },
resource: "/folder/test.css",
request: "/path/css-loader!/folder/test.css",
query: "?sourceMap"
Expand All @@ -98,7 +146,30 @@ describe("source maps", function() {
]);
testMap("generate sourceMap (2 loaders)", ".class { a: b c d; }", undefined, {
loaders: [{request: "/path/css-loader"}, {request: "/path/sass-loader"}],
options: { context: "/" },
resource: "/folder/test.scss",
request: "/path/css-loader!/path/sass-loader!/folder/test.scss",
query: "?sourceMap"
}, [
[1, ".class { a: b c d; }", "", {
file: 'test.scss',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.scss' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
}]
]);
testMap("generate sourceMap (2 loaders) and map exist", ".class { a: b c d; }", {
file: 'test.scss',
mappings: 'AAAA,SAAS,SAAS,EAAE',
names: [],
sourceRoot: '',
sources: [ '/folder/test.scss' ],
sourcesContent: [ '.class { a: b c d; }' ],
version: 3
}, {
loaders: [{request: "/path/css-loader"}, {request: "/path/sass-loader"}],
resource: "/folder/test.scss",
request: "/path/css-loader!/path/sass-loader!/folder/test.scss",
query: "?sourceMap"
Expand All @@ -115,7 +186,6 @@ describe("source maps", function() {
]);
testMap("don't generate sourceMap (1 loader)", ".class { a: b c d; }", undefined, {
loaders: [{request: "/path/css-loader"}],
options: { context: "/" },
resource: "/folder/test.css",
request: "/path/css-loader!/folder/test.css",
query: "?sourceMap=false"
Expand Down