feat: issue 1256

Author: cap-Bernardito

Diff for: README.md

@@ -1132,7 +1132,7 @@ module.exports = {
 
 ## Examples
 
-### Disabling sources resolving using the `/* webpackIgnore: true */` comment
+### Disable url resolving using the `/* webpackIgnore: true */` comment
 
 With the help of the `/* webpackIgnore: true */`comment, it is possible to disable sources handling for rules and for individual declarations.
 
@@ -1143,23 +1143,35 @@ With the help of the `/* webpackIgnore: true */`comment, it is possible to disab
 
 /** webpackIgnore: true */
 .class {
+  /* Disabled url handling for the all .class */
   color: red;
   background: url("./url/img.png");
 }
 
 .class {
+  /* Disabled url handling for the first url in 'background' declaration */
   color: red;
-  background: /** webpackIgnore: true */ url("./url/img.png");
+  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 {
+  /* Disabled url handling for the 3 and 6 urls in 'background-image' declaration */
   background-image: image-set(
     url(./url/img.png) 2x,
     url(./url/img.png) 3x,
     /*webpackIgnore:  true*/ url(./url/img.png) 4x,
     url(./url/img.png) 5x,
     url(./url/img.png) 6x,
-    /*webpackIgnore:  true*/ url(./url/img.png) 7x
+    /*webpackIgnore:  true*/
+    url(./url/img.png) 7x
   );
 }
 ```

Diff for: src/plugins/postcss-import-parser.js

@@ -5,7 +5,7 @@ import {
   resolveRequests,
   isUrlRequestable,
   requestify,
-  isWebpackIgnoreSource,
+  isWebpackIgnoreComment,
 } from "../utils";
 
 function visitor(result, parsedResults, node, key) {
@@ -14,6 +14,10 @@ function visitor(result, parsedResults, node, key) {
     return;
   }
 
+  if (isWebpackIgnoreComment(node)) {
+    return;
+  }
+
   // Nodes do not exists - `@import url('http://') :root {}`
   if (node.nodes) {
     result.warn(
@@ -97,10 +101,6 @@ const plugin = (options = {}) => {
           for (const parsedResult of parsedResults) {
             const { node, url, isStringValue, mediaNodes } = parsedResult;
 
-            if (isWebpackIgnoreSource(node)) {
-              return;
-            }
-
             let normalizedUrl = url;
             let prefix = "";
 

Diff for: src/plugins/postcss-url-parser.js

@@ -5,8 +5,8 @@ import {
   requestify,
   resolveRequests,
   isUrlRequestable,
-  isWebpackIgnoreSource,
-  webpackIgnoreRegexp,
+  isWebpackIgnoreComment,
+  webpackIgnoreCommentRegexp,
 } from "../utils";
 
 const isUrlFunc = /url/i;
@@ -37,19 +37,25 @@ function visitor(result, parsedResults, node, key) {
     return;
   }
 
-  if (isWebpackIgnoreSource(node)) {
+  if (isWebpackIgnoreComment(node)) {
     return;
   }
 
   const parsed = valueParser(
     typeof node.raws.value === "undefined" ? node[key] : node.raws.value.raw
   );
 
-  let webpackIgnore = false;
+  let webpackIgnore =
+    typeof node.raws.between !== "undefined" &&
+    webpackIgnoreCommentRegexp.test(node.raws.between);
+
+  if (webpackIgnore && isImageSetFunc.test(parsed.nodes[0].value)) {
+    return;
+  }
 
   parsed.walk((valueNode) => {
     if (valueNode.type === "comment") {
-      if (webpackIgnoreRegexp.test(valueNode.value)) {
+      if (webpackIgnoreCommentRegexp.test(valueNode.value)) {
         webpackIgnore = true;
       }
       return;
@@ -90,7 +96,7 @@ function visitor(result, parsedResults, node, key) {
         const { type, value } = nNode;
 
         if (type === "comment") {
-          if (webpackIgnoreRegexp.test(value)) {
+          if (webpackIgnoreCommentRegexp.test(value)) {
             imageSetWebpackIgnore = true;
           }
           // eslint-disable-next-line no-continue
@@ -126,6 +132,12 @@ function visitor(result, parsedResults, node, key) {
             });
           }
         } else if (type === "string") {
+          if (imageSetWebpackIgnore) {
+            imageSetWebpackIgnore = false;
+            // eslint-disable-next-line no-continue
+            continue;
+          }
+
           const rule = {
             node: nNode,
             url: value,
@@ -142,7 +154,6 @@ function visitor(result, parsedResults, node, key) {
           }
         }
       }
-
       // Do not traverse inside `image-set`
       // eslint-disable-next-line consistent-return
       return false;

Diff for: src/utils.js

@@ -19,7 +19,7 @@ const unescapeRegExp = new RegExp(
   "ig"
 );
 const matchNativeWin32Path = /^[A-Z]:[/\\]|^\\\\/i;
-const webpackIgnoreRegexp = /webpackIgnore:(\s+)?true/i;
+const webpackIgnoreCommentRegexp = /webpackIgnore:(\s+)?true/i;
 
 function unescape(str) {
   return str.replace(unescapeRegExp, (_, escaped, escapedWhitespace) => {
@@ -703,38 +703,29 @@ function sort(a, b) {
   return a.index - b.index;
 }
 
-function isWebpackIgnoreSource(node) {
-  if (webpackIgnoreRegexp.test(node.raws.afterName)) {
+function isWebpackIgnoreComment(node) {
+  if (webpackIgnoreCommentRegexp.test(`${node.raws.afterName}`)) {
     return true;
   }
 
-  if (webpackIgnoreRegexp.test(node.raws.between)) {
-    return true;
-  }
-
-  let rule;
+  const possibleCommentPlaces = [node.prev()];
 
-  // eslint-disable-next-line default-case
-  switch (node.type) {
-    case "atrule":
-      rule = node;
-      break;
-    case "decl":
-      rule = node.parent;
-      break;
+  if (node.type === "decl") {
+    possibleCommentPlaces.push(node.parent.prev());
   }
 
-  const prevNode = rule.prev();
-
-  if (typeof prevNode === "undefined") {
-    return false;
-  }
+  for (const prevNode of possibleCommentPlaces.filter((i) => Boolean(i))) {
+    if (prevNode.type !== "comment") {
+      // eslint-disable-next-line no-continue
+      continue;
+    }
 
-  if (prevNode.type !== "comment") {
-    return false;
+    if (webpackIgnoreCommentRegexp.test(prevNode.text)) {
+      return true;
+    }
   }
 
-  return webpackIgnoreRegexp.test(prevNode.text);
+  return false;
 }
 
 export {
@@ -756,6 +747,6 @@ export {
   resolveRequests,
   isUrlRequestable,
   sort,
-  isWebpackIgnoreSource,
-  webpackIgnoreRegexp,
+  isWebpackIgnoreComment,
+  webpackIgnoreCommentRegexp,
 };

Diff for: test/__snapshots__/loader.test.js.snap

@@ -730,17 +730,21 @@ exports[`loader should work with webpackIgnore comment: module 1`] = `
 import ___CSS_LOADER_API_IMPORT___ from \\"../../src/runtime/api.js\\";
 import ___CSS_LOADER_GET_URL_IMPORT___ from \\"../../src/runtime/getUrl.js\\";
 import ___CSS_LOADER_URL_IMPORT_0___ from \\"./url/img.png\\";
-import ___CSS_LOADER_URL_IMPORT_1___ from \\"./fonts/Roboto-Regular.eot\\";
+import ___CSS_LOADER_URL_IMPORT_1___ from \\"./fonts/Roboto-Regular.woff2\\";
 import ___CSS_LOADER_URL_IMPORT_2___ from \\"./fonts/Roboto-Regular.woff\\";
-import ___CSS_LOADER_URL_IMPORT_3___ from \\"./fonts/Roboto-Regular.svg\\";
+import ___CSS_LOADER_URL_IMPORT_3___ from \\"./fonts/Roboto-Regular.ttf\\";
+import ___CSS_LOADER_URL_IMPORT_4___ from \\"./fonts/Roboto-Regular.svg\\";
+import ___CSS_LOADER_URL_IMPORT_5___ from \\"./fonts/Roboto-Regular.eot\\";
 var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]});
 var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
 var ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);
-var ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___, { hash: \\"#iefix\\" });
-var ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);
-var ___CSS_LOADER_URL_REPLACEMENT_4___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___, { hash: \\"#Roboto-Regular\\" });
+var ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);
+var ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);
+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\\" });
 // 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\\\\\\");\\\\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: /** webpackIgnore: true **/\\\\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_1___ + \\");\\\\n  src:\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_2___ + \\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n      /** webpackIgnore: true **/\\\\n    url(\\\\\\"./fonts/Roboto-Regular.woff2\\\\\\") format(\\\\\\"woff\\\\\\"),\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_3___ + \\") 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    url(./url/img.png) 5x,\\\\n    url(./url/img.png) 6x,\\\\n    url(./url/img.png) 7x\\\\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    url(./url/img.png) 5x,\\\\n    url(./url/img.png) 6x,\\\\n    url(./url/img.png) 7x\\\\n  );\\\\n}\\\\n\\\\n.class {\\\\n  background-image: image-set(\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 2x,\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 3x,\\\\n      /*webpackIgnore:  true*/\\\\n    url(./url/img.png) 4x,\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 5x,\\\\n    url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\") 6x,\\\\n      /*webpackIgnore:  true*/\\\\n    url(./url/img.png) 7x\\\\n  );\\\\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/** 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\\", \\"\\"]);
 // Exports
 export default ___CSS_LOADER_EXPORT___;
 "
@@ -766,7 +770,13 @@ Array [
 
 .class {
   color: red;
-  background: /** webpackIgnore: true */ url(\\"./url/img.png\\");
+  background: /** webpackIgnore: true */ url(\\"./url/img.png\\"),  url(/webpack/public/path/img.png);
+}
+
+.class {
+  color: red;
+  /** webpackIgnore: true */
+  background:  url(\\"./url/img.png\\"),  url(\\"./url/img.png\\");
 }
 
 .class {
@@ -800,7 +810,22 @@ Array [
 @font-face {
   font-family: \\"Roboto\\";
   src: /** webpackIgnore: true **/ url(\\"./fonts/Roboto-Regular.eot\\");
-  src: /** webpackIgnore: true **/
+  src:
+    /** webpackIgnore: true **/
+    url(\\"./fonts/Roboto-Regular.eot#iefix\\") format(\\"embedded-opentype\\"),
+    url(/webpack/public/path/Roboto-Regular.woff2) format(\\"woff\\"),
+    url(/webpack/public/path/Roboto-Regular.woff) format(\\"woff\\"),
+    url(/webpack/public/path/Roboto-Regular.ttf) format(\\"truetype\\"),
+    url(/webpack/public/path/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\\");
+  /** webpackIgnore: true **/
+  src:
     url(\\"./fonts/Roboto-Regular.eot#iefix\\") format(\\"embedded-opentype\\"),
     url(\\"./fonts/Roboto-Regular.woff2\\") format(\\"woff\\"),
     url(\\"./fonts/Roboto-Regular.woff\\") format(\\"woff\\"),
@@ -830,37 +855,36 @@ Array [
   background-image: image-set(
     url(./url/img.png) 2x,
     url(./url/img.png) 3x,
-    url(./url/img.png) 4x,
-    url(./url/img.png) 5x,
-    url(./url/img.png) 6x,
-    url(./url/img.png) 7x
+    url(./url/img.png) 4x
+  );
+}
+
+.class {
+  /*webpackIgnore:  true*/
+  background-image: image-set(
+    url(./url/img.png) 2x,
+    url(./url/img.png) 3x,
+    url(./url/img.png) 4x
   );
 }
 
 .class {
   background-image: /*webpackIgnore:  true*/ image-set(
     url(./url/img.png) 2x,
     url(./url/img.png) 3x,
-    url(./url/img.png) 4x,
-    url(./url/img.png) 5x,
-    url(./url/img.png) 6x,
-    url(./url/img.png) 7x
+    url(./url/img.png) 4x
   );
 }
 
 .class {
   background-image: image-set(
-    url(/webpack/public/path/img.png) 2x,
+    /*webpackIgnore:  true*/
+    url(./url/img.png) 2x,
     url(/webpack/public/path/img.png) 3x,
       /*webpackIgnore:  true*/
-    url(./url/img.png) 4x,
-    url(/webpack/public/path/img.png) 5x,
-    url(/webpack/public/path/img.png) 6x,
-      /*webpackIgnore:  true*/
-    url(./url/img.png) 7x
+    url(./url/img.png) 5x
   );
 }
-
 ",
     "",
   ],