Skip to content

Commit ded616f

Browse files
cap-Bernarditocap-Bernardito
committed
feat: sources import with new url
1 parent 899a4e3 commit ded616f

File tree

11 files changed

+357
-365
lines changed

11 files changed

+357
-365
lines changed

‎src/plugins/postcss-url-parser.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -356,6 +356,7 @@ const plugin = (options = {}) => {
356356
urlToNameMap.set(newUrl, importName);
357357

358358
options.imports.push({
359+
type: "asset",
359360
importName,
360361
url: options.urlHandler(newUrl),
361362
index,

‎src/runtime/getUrl.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ module.exports = (url, options) => {
44
options = {};
55
}
66

7-
// eslint-disable-next-line no-underscore-dangle, no-param-reassign
8-
url = url && url.__esModule ? url.default : url;
9-
10-
if (typeof url !== "string") {
7+
if (!url || typeof url === "boolean") {
118
return url;
129
}
1310

11+
// eslint-disable-next-line no-underscore-dangle, no-param-reassign
12+
url = String(url.__esModule ? url.default : url);
13+
1414
// If url is already wrapped in quotes, remove them
1515
if (/^['"].*['"]$/.test(url)) {
1616
// eslint-disable-next-line no-param-reassign
@@ -24,7 +24,7 @@ module.exports = (url, options) => {
2424

2525
// Should url be wrapped?
2626
// See https://drafts.csswg.org/css-values-3/#urls
27-
if (/["'() \t\n]/.test(url) || options.needQuotes) {
27+
if (/["'() \t\n]|(%20)/.test(url) || options.needQuotes) {
2828
return `"${url.replace(/"/g, '\\"').replace(/\n/g, "\\n")}"`;
2929
}
3030

‎src/utils.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -589,15 +589,18 @@ function getImportCode(imports, options) {
589589
let code = "";
590590

591591
for (const item of imports) {
592-
const { importName, url, icss } = item;
592+
const { importName, url, icss, type } = item;
593593

594594
if (options.esModule) {
595595
if (icss && options.modules.namedExport) {
596596
code += `import ${
597597
options.modules.exportOnlyLocals ? "" : `${importName}, `
598598
}* as ${importName}_NAMED___ from ${url};\n`;
599599
} else {
600-
code += `import ${importName} from ${url};\n`;
600+
code +=
601+
type === "asset"
602+
? `var ${importName} = new URL(${url}, import.meta.url);\n`
603+
: `import ${importName} from ${url};\n`;
601604
}
602605
} else {
603606
code += `var ${importName} = require(${url});\n`;

‎test/__snapshots__/esModule-option.test.js.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ exports[`"esModule" option should work when not specified: module 1`] = `
77
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
88
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
99
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
10-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
10+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
1111
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
1212
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
1313
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -99,7 +99,7 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
9999
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
100100
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
101101
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
102-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
102+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
103103
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
104104
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
105105
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -145,7 +145,7 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
145145
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
146146
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
147147
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
148-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
148+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
149149
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
150150
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
151151
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -194,7 +194,7 @@ exports[`"esModule" option should work with a value equal to "true" and the "mod
194194
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
195195
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
196196
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
197-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
197+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
198198
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
199199
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
200200
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -243,7 +243,7 @@ exports[`"esModule" option should work with a value equal to "true": module 1`]
243243
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
244244
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
245245
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
246-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
246+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
247247
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
248248
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
249249
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);

‎test/__snapshots__/import-option.test.js.snap

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -436,7 +436,7 @@ import ___CSS_LOADER_AT_RULE_IMPORT_17___ from \\"-!../../../src/index.js??ruleS
436436
import ___CSS_LOADER_AT_RULE_IMPORT_18___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./something.css?foo=2&bar=1\\";
437437
import ___CSS_LOADER_AT_RULE_IMPORT_19___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./my.scss\\";
438438
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
439-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
439+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
440440
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
441441
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___, \\"screen and (orientation:landscape)\\");
442442
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_1___, \\"(min-width: 100px)\\");
@@ -989,7 +989,7 @@ import ___CSS_LOADER_AT_RULE_IMPORT_23___ from \\"-!../../../src/index.js??ruleS
989989
import ___CSS_LOADER_AT_RULE_IMPORT_24___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./something.css?foo=2&bar=1\\";
990990
import ___CSS_LOADER_AT_RULE_IMPORT_25___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./my.scss\\";
991991
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
992-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
992+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
993993
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
994994
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
995995
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
@@ -1900,7 +1900,7 @@ exports[`"import" option should work with a value equal to "false": module 1`] =
19001900
"// Imports
19011901
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
19021902
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
1903-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
1903+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
19041904
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
19051905
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
19061906
// Module
@@ -2109,7 +2109,7 @@ import ___CSS_LOADER_AT_RULE_IMPORT_23___ from \\"-!../../../src/index.js??ruleS
21092109
import ___CSS_LOADER_AT_RULE_IMPORT_24___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./something.css?foo=2&bar=1\\";
21102110
import ___CSS_LOADER_AT_RULE_IMPORT_25___ from \\"-!../../../src/index.js??ruleSet[1].rules[0].use[0]!./my.scss\\";
21112111
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
2112-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img.png\\";
2112+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img.png\\", import.meta.url);
21132113
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
21142114
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
21152115
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);

‎test/__snapshots__/loader.test.js.snap

Lines changed: 14 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ exports[`loader should pass queries to other loader: module 1`] = `
7070
"// Imports
7171
import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
7272
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
73-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/image.svg?color=%23BAAFDB%3F\\";
73+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./url/image.svg?color=%23BAAFDB%3F\\", import.meta.url);
7474
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
7575
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___, { hash: \\"#foo\\" });
7676
// Module
@@ -85,7 +85,7 @@ Array [
8585
Array [
8686
"./other-loader-query.css",
8787
".example {
88-
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk+A8AAQUBAScY42YAAAAASUVORK5CYII=#foo);
88+
background-image: url(/webpack/public/path/image.svg#foo);
8989
}
9090
",
9191
"",
@@ -101,8 +101,8 @@ exports[`loader should reuse \`ast\` from "postcss-loader": module 1`] = `
101101
"// Imports
102102
import ___CSS_LOADER_API_IMPORT___ from \\"../../../src/runtime/api.js\\";
103103
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../../src/runtime/getUrl.js\\";
104-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./img1x.png\\";
105-
import ___CSS_LOADER_URL_IMPORT_1___ from \\"./img2x.png\\";
104+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./img1x.png\\", import.meta.url);
105+
var ___CSS_LOADER_URL_IMPORT_1___ = new URL(\\"./img2x.png\\", import.meta.url);
106106
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
107107
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
108108
var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);
@@ -215,13 +215,7 @@ CssSyntaxError
215215

216216
exports[`loader should throw error on invalid css syntax: warnings 1`] = `Array []`;
217217

218-
exports[`loader should throws error when no loader(s) for assets: errors 1`] = `
219-
Array [
220-
"ModuleParseError: Module parse failed: Unexpected character '�' (1:0)
221-
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
222-
(Source code omitted for this binary file)",
223-
]
224-
`;
218+
exports[`loader should throws error when no loader(s) for assets: errors 1`] = `Array []`;
225219

226220
exports[`loader should throws error when no loader(s) for assets: warnings 1`] = `Array []`;
227221

@@ -232,7 +226,7 @@ exports[`loader should work with "asset" module type: module 1`] = `
232226
import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
233227
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../src/index.js!./imported.css\\";
234228
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
235-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/img.png\\";
229+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./url/img.png\\", import.meta.url);
236230
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
237231
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
238232
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -470,7 +464,7 @@ exports[`loader should work with empty options: module 1`] = `
470464
import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
471465
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
472466
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
473-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/img.png\\";
467+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./url/img.png\\", import.meta.url);
474468
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
475469
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
476470
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
@@ -856,12 +850,12 @@ exports[`loader should work with webpackIgnore comment: module 1`] = `
856850
import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
857851
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../src/index.js??ruleSet[1].rules[0].use[0]!./simple.css\\";
858852
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
859-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/img.png\\";
860-
import ___CSS_LOADER_URL_IMPORT_1___ from \\"./fonts/Roboto-Regular.woff2\\";
861-
import ___CSS_LOADER_URL_IMPORT_2___ from \\"./fonts/Roboto-Regular.woff\\";
862-
import ___CSS_LOADER_URL_IMPORT_3___ from \\"./fonts/Roboto-Regular.ttf\\";
863-
import ___CSS_LOADER_URL_IMPORT_4___ from \\"./fonts/Roboto-Regular.svg\\";
864-
import ___CSS_LOADER_URL_IMPORT_5___ from \\"./fonts/Roboto-Regular.eot\\";
853+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./url/img.png\\", import.meta.url);
854+
var ___CSS_LOADER_URL_IMPORT_1___ = new URL(\\"./fonts/Roboto-Regular.woff2\\", import.meta.url);
855+
var ___CSS_LOADER_URL_IMPORT_2___ = new URL(\\"./fonts/Roboto-Regular.woff\\", import.meta.url);
856+
var ___CSS_LOADER_URL_IMPORT_3___ = new URL(\\"./fonts/Roboto-Regular.ttf\\", import.meta.url);
857+
var ___CSS_LOADER_URL_IMPORT_4___ = new URL(\\"./fonts/Roboto-Regular.svg\\", import.meta.url);
858+
var ___CSS_LOADER_URL_IMPORT_5___ = new URL(\\"./fonts/Roboto-Regular.eot\\", import.meta.url);
865859
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
866860
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
867861
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
@@ -1184,7 +1178,7 @@ exports[`loader should work: module 1`] = `
11841178
import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
11851179
import ___CSS_LOADER_AT_RULE_IMPORT_0___ from \\"-!../../src/index.js??ruleSet[1].rules[0].use[0]!./imported.css\\";
11861180
import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
1187-
import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/img.png\\";
1181+
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(\\"./url/img.png\\", import.meta.url);
11881182
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
11891183
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
11901184
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);

0 commit comments

Comments
 (0)