From 9e52d26ba93845c9ff3d69940f36596cf4b2bb8f Mon Sep 17 00:00:00 2001 From: Evilebot Tnawi Date: Fri, 30 Nov 2018 14:05:31 +0300 Subject: [PATCH] fix: don't break loader on invalid or not exists url or import token (#827) --- lib/loader.js | 14 ++++++++++++-- test/__snapshots__/url-option.test.js.snap | 22 ++++++++++++++++++++-- test/fixtures/url/url.css | 9 +++++++++ 3 files changed, 41 insertions(+), 4 deletions(-) diff --git a/lib/loader.js b/lib/loader.js index a2338012..b6bca865 100644 --- a/lib/loader.js +++ b/lib/loader.js @@ -130,7 +130,12 @@ module.exports = function loader(content, map) { // Prepare replacer to change from `___CSS_LOADER_IMPORT___INDEX___` to `require('./file.css').locals` const importItemReplacer = (item) => { const match = placholderRegExps.importItem.exec(item); - const idx = +match[1]; + const idx = Number(match[1]); + + if (!importItems[idx]) { + return item; + } + const importItem = importItems[idx]; const importUrl = importUrlPrefix + importItem.url; @@ -208,7 +213,12 @@ module.exports = function loader(content, map) { placholderRegExps.urlItemG, (item) => { const match = placholderRegExps.urlItem.exec(item); - let idx = +match[1]; + let idx = Number(match[1]); + + if (!urlItems[idx]) { + return item; + } + const urlItem = urlItems[idx]; const { url } = urlItem; diff --git a/test/__snapshots__/url-option.test.js.snap b/test/__snapshots__/url-option.test.js.snap index a502cc7d..16f7bba5 100644 --- a/test/__snapshots__/url-option.test.js.snap +++ b/test/__snapshots__/url-option.test.js.snap @@ -183,6 +183,15 @@ b { .class { background-image: url('img.png') url(\\"data:image/svg+xml;charset=utf-8,\\") url('img.png'); } + +.class { + background: ___CSS_LOADER_URL___; + background: ___CSS_LOADER_URL___INDEX___; + background: ___CSS_LOADER_URL___99999___; + background: ___CSS_LOADER_IMPORT___; + background: ___CSS_LOADER_IMPORT___INDEX___; + background: ___CSS_LOADER_IMPORT___99999___; +} ", "", ], @@ -195,7 +204,7 @@ exports[`url option false: module 1`] = ` exports.i(require(\\"-!../../../index.js??ref--4-0!./imported.css\\"), \\"\\"); // module -exports.push([module.id, \\".class {\\\\n background: url('img.png');\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(img.png);\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\n \\\\\\"img.png\\\\\\"\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background: green url( 'img.png' ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( \\\\\\"img.png\\\\\\" ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( img.png ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(~package/img.png) url(other-img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( \\\\\\"img img.png\\\\\\" ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( 'img img.png' ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(/img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n 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%2523007aff%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\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,#filter');\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%5C%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%5C%22%3E%3Cfilter%20id%3D%5C%22filter%5C%22%3E%3CfeGaussianBlur%20in%3D%5C%22SourceAlpha%5C%22%20stdDeviation%3D%5C%220%5C%22%20%2F%3E%3CfeOffset%20dx%3D%5C%221%5C%22%20dy%3D%5C%222%5C%22%20result%3D%5C%22offsetblur%5C%22%20%2F%3E%3CfeFlood%20flood-color%3D%5C%22rgba(255%2C255%2C255%2C1)%5C%22%20%2F%3E%3CfeComposite%20in2%3D%5C%22offsetblur%5C%22%20operator%3D%5C%22in%5C%22%20%2F%3E%3CfeMerge%3E%3CfeMergeNode%20%2F%3E%3CfeMergeNode%20in%3D%5C%22SourceGraphic%5C%22%20%2F%3E%3C%2FfeMerge%3E%3C%2Ffilter%3E%3C%2Fsvg%3E%23filter');\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url(#highlight);\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url('#line-marker');\\\\n}\\\\n\\\\n@font-face {\\\\n src: url(font.woff) format('woff'),\\\\n url('font.woff2') format('woff2'),\\\\n url(\\\\\\"font.eot\\\\\\") format('eot'),\\\\n url(~package/font.ttf) format('truetype'),\\\\n url(\\\\\\"font with spaces.eot\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url('font.svg#svgFontName') format('svg'),\\\\n url('font.woff2?foo=bar') format('woff2'),\\\\n url(\\\\\\"font.eot?#iefix\\\\\\") format('embedded-opentype'),\\\\n url(\\\\\\"font with spaces.eot?#iefix\\\\\\") format('embedded-opentype');\\\\n}\\\\n\\\\n@media (min-width: 500px) {\\\\n body {\\\\n background: url(\\\\\\"img.png\\\\\\");\\\\n }\\\\n}\\\\n\\\\na {\\\\n content: \\\\\\"do not use url(path)\\\\\\";\\\\n}\\\\n\\\\nb {\\\\n content: 'do not \\\\\\"use\\\\\\" url(path)';\\\\n}\\\\n\\\\n@keyframes anim {\\\\n background: green url('img.png') xyz;\\\\n}\\\\n\\\\n.a {\\\\n background-image: -webkit-image-set(url('img1x.png') 1x, url('img2x.png') 2x)\\\\n}\\\\n\\\\n.a {\\\\n background-image: image-set(url('img1x.png') 1x, url('img2x.png') 2x)\\\\n}\\\\n\\\\n.class {\\\\n background: green url() xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\\\"\\\\\\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(' ') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\n \\\\n ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background-image: url('img.png') url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\") url('img.png');\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".class {\\\\n background: url('img.png');\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(img.png);\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\n \\\\\\"img.png\\\\\\"\\\\n );\\\\n}\\\\n\\\\n.class {\\\\n background: green url( 'img.png' ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( \\\\\\"img.png\\\\\\" ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( img.png ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(~package/img.png) url(other-img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( \\\\\\"img img.png\\\\\\" ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url( 'img img.png' ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(/img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n 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%2523007aff%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\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,#filter');\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%5C%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%5C%22%3E%3Cfilter%20id%3D%5C%22filter%5C%22%3E%3CfeGaussianBlur%20in%3D%5C%22SourceAlpha%5C%22%20stdDeviation%3D%5C%220%5C%22%20%2F%3E%3CfeOffset%20dx%3D%5C%221%5C%22%20dy%3D%5C%222%5C%22%20result%3D%5C%22offsetblur%5C%22%20%2F%3E%3CfeFlood%20flood-color%3D%5C%22rgba(255%2C255%2C255%2C1)%5C%22%20%2F%3E%3CfeComposite%20in2%3D%5C%22offsetblur%5C%22%20operator%3D%5C%22in%5C%22%20%2F%3E%3CfeMerge%3E%3CfeMergeNode%20%2F%3E%3CfeMergeNode%20in%3D%5C%22SourceGraphic%5C%22%20%2F%3E%3C%2FfeMerge%3E%3C%2Ffilter%3E%3C%2Fsvg%3E%23filter');\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url(#highlight);\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url('#line-marker');\\\\n}\\\\n\\\\n@font-face {\\\\n src: url(font.woff) format('woff'),\\\\n url('font.woff2') format('woff2'),\\\\n url(\\\\\\"font.eot\\\\\\") format('eot'),\\\\n url(~package/font.ttf) format('truetype'),\\\\n url(\\\\\\"font with spaces.eot\\\\\\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url('font.svg#svgFontName') format('svg'),\\\\n url('font.woff2?foo=bar') format('woff2'),\\\\n url(\\\\\\"font.eot?#iefix\\\\\\") format('embedded-opentype'),\\\\n url(\\\\\\"font with spaces.eot?#iefix\\\\\\") format('embedded-opentype');\\\\n}\\\\n\\\\n@media (min-width: 500px) {\\\\n body {\\\\n background: url(\\\\\\"img.png\\\\\\");\\\\n }\\\\n}\\\\n\\\\na {\\\\n content: \\\\\\"do not use url(path)\\\\\\";\\\\n}\\\\n\\\\nb {\\\\n content: 'do not \\\\\\"use\\\\\\" url(path)';\\\\n}\\\\n\\\\n@keyframes anim {\\\\n background: green url('img.png') xyz;\\\\n}\\\\n\\\\n.a {\\\\n background-image: -webkit-image-set(url('img1x.png') 1x, url('img2x.png') 2x)\\\\n}\\\\n\\\\n.a {\\\\n background-image: image-set(url('img1x.png') 1x, url('img2x.png') 2x)\\\\n}\\\\n\\\\n.class {\\\\n background: green url() xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\\\"\\\\\\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(' ') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\n \\\\n ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?foo=bar#hash\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\\\\\"img.png?\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n background-image: url('img.png') url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\") url('img.png');\\\\n}\\\\n\\\\n.class {\\\\n background: ___CSS_LOADER_URL___;\\\\n background: ___CSS_LOADER_URL___INDEX___;\\\\n background: ___CSS_LOADER_URL___99999___;\\\\n background: ___CSS_LOADER_IMPORT___;\\\\n background: ___CSS_LOADER_IMPORT___INDEX___;\\\\n background: ___CSS_LOADER_IMPORT___99999___;\\\\n}\\\\n\\", \\"\\"]); // exports " @@ -384,6 +393,15 @@ b { .class { background-image: url(/webpack/public/path/img.png) url(\\"data:image/svg+xml;charset=utf-8,\\") url(/webpack/public/path/img.png); } + +.class { + background: ___CSS_LOADER_URL___; + background: ___CSS_LOADER_URL___INDEX___; + background: ___CSS_LOADER_URL___99999___; + background: ___CSS_LOADER_IMPORT___; + background: ___CSS_LOADER_IMPORT___INDEX___; + background: ___CSS_LOADER_IMPORT___99999___; +} ", "", ], @@ -397,7 +415,7 @@ exports = module.exports = require(\\"../../../lib/runtime/api.js\\")(false); exports.i(require(\\"-!../../../index.js??ref--4-0!./imported.css\\"), \\"\\"); // module -exports.push([module.id, \\".class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"package/img.png\\")) + \\") url(\\" + escape(require(\\"./other-img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(/img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n 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%2523007aff%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\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,#filter');\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%5C%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%5C%22%3E%3Cfilter%20id%3D%5C%22filter%5C%22%3E%3CfeGaussianBlur%20in%3D%5C%22SourceAlpha%5C%22%20stdDeviation%3D%5C%220%5C%22%20%2F%3E%3CfeOffset%20dx%3D%5C%221%5C%22%20dy%3D%5C%222%5C%22%20result%3D%5C%22offsetblur%5C%22%20%2F%3E%3CfeFlood%20flood-color%3D%5C%22rgba(255%2C255%2C255%2C1)%5C%22%20%2F%3E%3CfeComposite%20in2%3D%5C%22offsetblur%5C%22%20operator%3D%5C%22in%5C%22%20%2F%3E%3CfeMerge%3E%3CfeMergeNode%20%2F%3E%3CfeMergeNode%20in%3D%5C%22SourceGraphic%5C%22%20%2F%3E%3C%2FfeMerge%3E%3C%2Ffilter%3E%3C%2Fsvg%3E%23filter');\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url(#highlight);\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url('#line-marker');\\\\n}\\\\n\\\\n@font-face {\\\\n src: url(\\" + escape(require(\\"./font.woff\\")) + \\") format('woff'),\\\\n url(\\" + escape(require(\\"./font.woff2\\")) + \\") format('woff2'),\\\\n url(\\" + escape(require(\\"./font.eot\\")) + \\") format('eot'),\\\\n url(\\" + escape(require(\\"package/font.ttf\\")) + \\") format('truetype'),\\\\n url(\\" + escape(require(\\"./font with spaces.eot\\")) + \\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\" + escape(require(\\"./font.svg\\") + \\"#svgFontName\\") + \\") format('svg'),\\\\n url(\\" + escape(require(\\"./font.woff2?foo=bar\\")) + \\") format('woff2'),\\\\n url(\\" + escape(require(\\"./font.eot\\") + \\"?#iefix\\") + \\") format('embedded-opentype'),\\\\n url(\\" + escape(require(\\"./font with spaces.eot\\") + \\"?#iefix\\") + \\") format('embedded-opentype');\\\\n}\\\\n\\\\n@media (min-width: 500px) {\\\\n body {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n }\\\\n}\\\\n\\\\na {\\\\n content: \\\\\\"do not use url(path)\\\\\\";\\\\n}\\\\n\\\\nb {\\\\n content: 'do not \\\\\\"use\\\\\\" url(path)';\\\\n}\\\\n\\\\n@keyframes anim {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.a {\\\\n background-image: -webkit-image-set(url(\\" + escape(require(\\"./img1x.png\\")) + \\") 1x, url(\\" + escape(require(\\"./img2x.png\\")) + \\") 2x)\\\\n}\\\\n\\\\n.a {\\\\n background-image: image-set(url(\\" + escape(require(\\"./img1x.png\\")) + \\") 1x, url(\\" + escape(require(\\"./img2x.png\\")) + \\") 2x)\\\\n}\\\\n\\\\n.class {\\\\n background: green url() xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\\\"\\\\\\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\n \\\\n ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\" + escape(require(\\"./img.png\\")) + \\") url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\") url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"package/img.png\\")) + \\") url(\\" + escape(require(\\"./other-img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\" + escape(require(\\"./img img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(/img.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n 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%2523007aff%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\\\\\\");\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,#filter');\\\\n}\\\\n\\\\n.class {\\\\n filter: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%5C%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%5C%22%3E%3Cfilter%20id%3D%5C%22filter%5C%22%3E%3CfeGaussianBlur%20in%3D%5C%22SourceAlpha%5C%22%20stdDeviation%3D%5C%220%5C%22%20%2F%3E%3CfeOffset%20dx%3D%5C%221%5C%22%20dy%3D%5C%222%5C%22%20result%3D%5C%22offsetblur%5C%22%20%2F%3E%3CfeFlood%20flood-color%3D%5C%22rgba(255%2C255%2C255%2C1)%5C%22%20%2F%3E%3CfeComposite%20in2%3D%5C%22offsetblur%5C%22%20operator%3D%5C%22in%5C%22%20%2F%3E%3CfeMerge%3E%3CfeMergeNode%20%2F%3E%3CfeMergeNode%20in%3D%5C%22SourceGraphic%5C%22%20%2F%3E%3C%2FfeMerge%3E%3C%2Ffilter%3E%3C%2Fsvg%3E%23filter');\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url(#highlight);\\\\n}\\\\n\\\\n.highlight {\\\\n filter: url('#line-marker');\\\\n}\\\\n\\\\n@font-face {\\\\n src: url(\\" + escape(require(\\"./font.woff\\")) + \\") format('woff'),\\\\n url(\\" + escape(require(\\"./font.woff2\\")) + \\") format('woff2'),\\\\n url(\\" + escape(require(\\"./font.eot\\")) + \\") format('eot'),\\\\n url(\\" + escape(require(\\"package/font.ttf\\")) + \\") format('truetype'),\\\\n url(\\" + escape(require(\\"./font with spaces.eot\\")) + \\") format(\\\\\\"embedded-opentype\\\\\\"),\\\\n url(\\" + escape(require(\\"./font.svg\\") + \\"#svgFontName\\") + \\") format('svg'),\\\\n url(\\" + escape(require(\\"./font.woff2?foo=bar\\")) + \\") format('woff2'),\\\\n url(\\" + escape(require(\\"./font.eot\\") + \\"?#iefix\\") + \\") format('embedded-opentype'),\\\\n url(\\" + escape(require(\\"./font with spaces.eot\\") + \\"?#iefix\\") + \\") format('embedded-opentype');\\\\n}\\\\n\\\\n@media (min-width: 500px) {\\\\n body {\\\\n background: url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n }\\\\n}\\\\n\\\\na {\\\\n content: \\\\\\"do not use url(path)\\\\\\";\\\\n}\\\\n\\\\nb {\\\\n content: 'do not \\\\\\"use\\\\\\" url(path)';\\\\n}\\\\n\\\\n@keyframes anim {\\\\n background: green url(\\" + escape(require(\\"./img.png\\")) + \\") xyz;\\\\n}\\\\n\\\\n.a {\\\\n background-image: -webkit-image-set(url(\\" + escape(require(\\"./img1x.png\\")) + \\") 1x, url(\\" + escape(require(\\"./img2x.png\\")) + \\") 2x)\\\\n}\\\\n\\\\n.a {\\\\n background-image: image-set(url(\\" + escape(require(\\"./img1x.png\\")) + \\") 1x, url(\\" + escape(require(\\"./img2x.png\\")) + \\") 2x)\\\\n}\\\\n\\\\n.class {\\\\n background: green url() xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\\\"\\\\\\") xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url('') xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(\\\\n \\\\n ) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(https://raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: green url(//raw.githubusercontent.com/webpack/media/master/logo/icon.png) xyz;\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?foo=bar\\") + \\"#hash\\") + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: url(\\" + escape(require(\\"./img.png?\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background-image: url(\\" + escape(require(\\"./img.png\\")) + \\") url(\\\\\\"data:image/svg+xml;charset=utf-8,\\\\\\") url(\\" + escape(require(\\"./img.png\\")) + \\");\\\\n}\\\\n\\\\n.class {\\\\n background: ___CSS_LOADER_URL___;\\\\n background: ___CSS_LOADER_URL___INDEX___;\\\\n background: ___CSS_LOADER_URL___99999___;\\\\n background: ___CSS_LOADER_IMPORT___;\\\\n background: ___CSS_LOADER_IMPORT___INDEX___;\\\\n background: ___CSS_LOADER_IMPORT___99999___;\\\\n}\\\\n\\", \\"\\"]); // exports " diff --git a/test/fixtures/url/url.css b/test/fixtures/url/url.css index b7e27c17..861893ac 100644 --- a/test/fixtures/url/url.css +++ b/test/fixtures/url/url.css @@ -168,3 +168,12 @@ b { .class { background-image: url('img.png') url("data:image/svg+xml;charset=utf-8,") url('img.png'); } + +.class { + background: ___CSS_LOADER_URL___; + background: ___CSS_LOADER_URL___INDEX___; + background: ___CSS_LOADER_URL___99999___; + background: ___CSS_LOADER_IMPORT___; + background: ___CSS_LOADER_IMPORT___INDEX___; + background: ___CSS_LOADER_IMPORT___99999___; +}