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

feat: issue 1256 #1264

Merged
merged 14 commits into from
Feb 25, 2021
Prev Previous commit
Next Next commit
refactor: code
alexander-akait committed Feb 19, 2021

Verified

This commit was signed with the committer’s verified signature.
ViBiOh Vincent Boutour
commit 58499ab229ed9fa80a2553b07c3a2a2aad6e4a9c
12 changes: 3 additions & 9 deletions README.md
Original file line number Diff line number Diff line change
@@ -1141,11 +1141,11 @@ With the help of the `/* webpackIgnore: true */`comment, it is possible to disab
@import url(./basic.css);
@import /* webpackIgnore: true */ url(./imported.css);

/** webpackIgnore: true */
.class {
/* Disabled url handling for the all .class */
/* Disabled url handling for the all urls in 'background' declaration */
color: red;
background: url("./url/img.png");
/** webpackIgnore: true */
background: url("./url/img.png"), url("./url/img.png");
}

.class {
@@ -1154,12 +1154,6 @@ With the help of the `/* webpackIgnore: true */`comment, it is possible to disab
background: /** webpackIgnore: true */ url("./url/img.png"),
url("./url/img.png");
}
.class {
/* Disabled url handling for the all urls in 'background' declaration */
color: red;
/** webpackIgnore: true */
background: url("./url/img.png"), url("./url/img.png");
}

/* prettier-ignore */
.class {
26 changes: 11 additions & 15 deletions src/utils.js
Original file line number Diff line number Diff line change
@@ -704,25 +704,21 @@ function sort(a, b) {
}

function isWebpackIgnoreComment(node) {
if (webpackIgnoreCommentRegexp.test(`${node.raws.afterName}`)) {
if (
node.raws.afterName &&
webpackIgnoreCommentRegexp.test(`${node.raws.afterName}`)
) {
return true;
}

const possibleCommentPlaces = [node.prev()];

if (node.type === "decl") {
possibleCommentPlaces.push(node.parent.prev());
}

for (const prevNode of possibleCommentPlaces.filter((i) => Boolean(i))) {
if (prevNode.type !== "comment") {
// eslint-disable-next-line no-continue
continue;
}
const prevNode = node.prev();

if (webpackIgnoreCommentRegexp.test(prevNode.text)) {
return true;
}
if (
prevNode &&
prevNode.type === "comment" &&
webpackIgnoreCommentRegexp.test(prevNode.text)
) {
return true;
}

return false;
42 changes: 12 additions & 30 deletions test/__snapshots__/loader.test.js.snap
Original file line number Diff line number Diff line change
@@ -743,8 +743,9 @@ var ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_
var ___CSS_LOADER_URL_REPLACEMENT_4___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_4___, { hash: \\"#Roboto-Regular\\" });
var ___CSS_LOADER_URL_REPLACEMENT_5___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_5___);
var ___CSS_LOADER_URL_REPLACEMENT_6___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_5___, { hash: \\"#iefix\\" });
var ___CSS_LOADER_URL_REPLACEMENT_7___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___, { needQuotes: true });
// Module
___CSS_LOADER_EXPORT___.push([module.id, \\"/*webpackIgnore: true*/\\\\n@import url(./basic.css);\\\\n\\\\n@import /* webpackIgnore: true */ url(./imported.css);\\\\n\\\\n/** webpackIgnore: true **/\\\\n@import url(./simple.css);\\\\n\\\\n/** webpackIgnore: true */\\\\n.class {\\\\n color: red;\\\\n background: url(\\\\\\"./url/img.png\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n color: red;\\\\n background: /** webpackIgnore: true */ url(\\\\\\"./url/img.png\\\\\\"), url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class {\\\\n color: red;\\\\n /** webpackIgnore: true */\\\\n background: url(\\\\\\"./url/img.png\\\\\\"), url(\\\\\\"./url/img.png\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background:\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/ url(\\\\\\"./url/img.png\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/ url(\\\\\\"./url/img.png\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./url/img.png\\\\\\");\\\\n}\\\\n\\\\n/** webpackIgnore: true **/\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: url(\\\\\\"./fonts/Roboto-Regular.eot\\\\\\");\\\\n src:\\\\n url(\\\\\\"./fonts/Roboto-Regular.eot#iefix\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.ttf\\\\\\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.svg#Roboto-Regular\\\\\\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: /** webpackIgnore: true **/ url(\\\\\\"./fonts/Roboto-Regular.eot\\\\\\");\\\\n src:\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.eot#iefix\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_3___ + \\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_4___ + \\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: /** webpackIgnore: true **/ url(\\\\\\"./fonts/Roboto-Regular.eot\\\\\\");\\\\n /** webpackIgnore: true **/\\\\n src:\\\\n url(\\\\\\"./fonts/Roboto-Regular.eot#iefix\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.ttf\\\\\\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.svg#Roboto-Regular\\\\\\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_5___ + \\");\\\\n src:\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_6___ + \\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.ttf\\\\\\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_4___ + \\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n/*webpackIgnore: true*/\\\\n.class {\\\\n background-image: image-set(\\\\n url(./url/img.png) 2x,\\\\n url(./url/img.png) 3x,\\\\n url(./url/img.png) 4x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n /*webpackIgnore: true*/\\\\n background-image: image-set(\\\\n url(./url/img.png) 2x,\\\\n url(./url/img.png) 3x,\\\\n url(./url/img.png) 4x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background-image: /*webpackIgnore: true*/ image-set(\\\\n url(./url/img.png) 2x,\\\\n url(./url/img.png) 3x,\\\\n url(./url/img.png) 4x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background-image: image-set(\\\\n /*webpackIgnore: true*/\\\\n url(./url/img.png) 2x,\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 3x,\\\\n /*webpackIgnore: true*/\\\\n url(./url/img.png) 5x\\\\n );\\\\n}\\\\n\\", \\"\\"]);
___CSS_LOADER_EXPORT___.push([module.id, \\"/*webpackIgnore: true*/\\\\n@import url(./basic.css);\\\\n\\\\n@import /* webpackIgnore: true */ url(./imported.css);\\\\n\\\\n/** webpackIgnore: true **/\\\\n@import url(./simple.css);\\\\n\\\\n.class {\\\\n color: red;\\\\n background: /** webpackIgnore: true */ url(\\\\\\"./url/img.png\\\\\\"), url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\\\n.class {\\\\n color: red;\\\\n /** webpackIgnore: true */\\\\n background: url(\\\\\\"./url/img.png\\\\\\"), url(\\\\\\"./url/img.png\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background:\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/ url(\\\\\\"./url/img.png\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/ url(\\\\\\"./url/img.png\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./url/img.png\\\\\\");\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: /** webpackIgnore: true **/ url(\\\\\\"./fonts/Roboto-Regular.eot\\\\\\");\\\\n src:\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.eot#iefix\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_1___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_3___ + \\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_4___ + \\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: /** webpackIgnore: true **/ url(\\\\\\"./fonts/Roboto-Regular.eot\\\\\\");\\\\n /** webpackIgnore: true **/\\\\n src:\\\\n url(\\\\\\"./fonts/Roboto-Regular.eot#iefix\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.ttf\\\\\\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\\\\\"./fonts/Roboto-Regular.svg#Roboto-Regular\\\\\\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n@font-face {\\\\n font-family: \\\\\\"Roboto\\\\\\";\\\\n src: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_5___ + \\");\\\\n src:\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_6___ + \\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \\") format(\\\\\\"woff\\\\\\"),\\\\n /** webpackIgnore: true **/\\\\n url(\\\\\\"./fonts/Roboto-Regular.ttf\\\\\\") format(\\\\\\"truetype\\\\\\"),\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_4___ + \\") format(\\\\\\"svg\\\\\\");\\\\n font-weight: 400;\\\\n font-style: normal;\\\\n}\\\\n\\\\n.class {\\\\n /*webpackIgnore: true*/\\\\n background-image: image-set(\\\\n url(./url/img.png) 2x,\\\\n url(./url/img.png) 3x,\\\\n url(./url/img.png) 4x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background-image: /*webpackIgnore: true*/ image-set(\\\\n url(./url/img.png) 2x,\\\\n url(./url/img.png) 3x,\\\\n url(./url/img.png) 4x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background-image: image-set(\\\\n /*webpackIgnore: true*/\\\\n url(./url/img.png) 2x,\\\\n url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 3x,\\\\n /*webpackIgnore: true*/\\\\n url(./url/img.png) 5x\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background-image: image-set(\\\\n /*webpackIgnore: true*/\\\\n './url/img.png' 2x,\\\\n \\" + ___CSS_LOADER_URL_REPLACEMENT_7___ + \\" 3x,\\\\n /*webpackIgnore: true*/\\\\n './url/img.png' 5x\\\\n );\\\\n}\\\\n\\", \\"\\"]);
// Exports
export default ___CSS_LOADER_EXPORT___;
"
@@ -762,12 +763,6 @@ Array [
/** webpackIgnore: true **/
@import url(./simple.css);

/** webpackIgnore: true */
.class {
color: red;
background: url(\\"./url/img.png\\");
}

.class {
color: red;
background: /** webpackIgnore: true */ url(\\"./url/img.png\\"), url(/webpack/public/path/img.png);
@@ -793,20 +788,6 @@ Array [
url(\\"./url/img.png\\");
}

/** webpackIgnore: true **/
@font-face {
font-family: \\"Roboto\\";
src: url(\\"./fonts/Roboto-Regular.eot\\");
src:
url(\\"./fonts/Roboto-Regular.eot#iefix\\") format(\\"embedded-opentype\\"),
url(\\"./fonts/Roboto-Regular.woff2\\") format(\\"woff\\"),
url(\\"./fonts/Roboto-Regular.woff\\") format(\\"woff\\"),
url(\\"./fonts/Roboto-Regular.ttf\\") format(\\"truetype\\"),
url(\\"./fonts/Roboto-Regular.svg#Roboto-Regular\\") format(\\"svg\\");
font-weight: 400;
font-style: normal;
}

@font-face {
font-family: \\"Roboto\\";
src: /** webpackIgnore: true **/ url(\\"./fonts/Roboto-Regular.eot\\");
@@ -850,15 +831,6 @@ Array [
font-style: normal;
}

/*webpackIgnore: true*/
.class {
background-image: image-set(
url(./url/img.png) 2x,
url(./url/img.png) 3x,
url(./url/img.png) 4x
);
}

.class {
/*webpackIgnore: true*/
background-image: image-set(
@@ -885,6 +857,16 @@ Array [
url(./url/img.png) 5x
);
}

.class {
background-image: image-set(
/*webpackIgnore: true*/
'./url/img.png' 2x,
\\"/webpack/public/path/img.png\\" 3x,
/*webpackIgnore: true*/
'./url/img.png' 5x
);
}
",
"",
],
39 changes: 10 additions & 29 deletions test/fixtures/webpackIgnore.css
Original file line number Diff line number Diff line change
@@ -6,12 +6,6 @@
/** webpackIgnore: true **/
@import url(./simple.css);

/** webpackIgnore: true */
.class {
color: red;
background: url("./url/img.png");
}

.class {
color: red;
background: /** webpackIgnore: true */ url("./url/img.png"), url("./url/img.png");
@@ -37,20 +31,6 @@
url("./url/img.png");
}

/** webpackIgnore: true **/
@font-face {
font-family: "Roboto";
src: url("./fonts/Roboto-Regular.eot");
src:
url("./fonts/Roboto-Regular.eot#iefix") format("embedded-opentype"),
url("./fonts/Roboto-Regular.woff2") format("woff"),
url("./fonts/Roboto-Regular.woff") format("woff"),
url("./fonts/Roboto-Regular.ttf") format("truetype"),
url("./fonts/Roboto-Regular.svg#Roboto-Regular") format("svg");
font-weight: 400;
font-style: normal;
}

@font-face {
font-family: "Roboto";
src: /** webpackIgnore: true **/ url("./fonts/Roboto-Regular.eot");
@@ -94,15 +74,6 @@
font-style: normal;
}

/*webpackIgnore: true*/
.class {
background-image: image-set(
url(./url/img.png) 2x,
url(./url/img.png) 3x,
url(./url/img.png) 4x
);
}

.class {
/*webpackIgnore: true*/
background-image: image-set(
@@ -129,3 +100,13 @@
url(./url/img.png) 5x
);
}

.class {
background-image: image-set(
/*webpackIgnore: true*/
'./url/img.png' 2x,
'./url/img.png' 3x,
/*webpackIgnore: true*/
'./url/img.png' 5x
);
}