From 2afe41e5f7ae7c435996b6303fc0a4ee41628f98 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Mon, 23 Mar 2020 19:01:06 +0300 Subject: [PATCH 01/13] refactor: code --- src/index.js | 3 --- src/utils.js | 3 --- 2 files changed, 6 deletions(-) diff --git a/src/index.js b/src/index.js index 977daeb2..5e06fbba 100644 --- a/src/index.js +++ b/src/index.js @@ -130,18 +130,15 @@ export default function loader(content, map, meta) { esModule ); const moduleCode = getModuleCode( - this, result, exportType, esModule, sourceMap, - importLoaders, apiImports, urlReplacements, icssReplacements ); const exportCode = getExportCode( - this, exports, exportType, localsConvention, diff --git a/src/utils.js b/src/utils.js index abed024c..c27e4b7c 100644 --- a/src/utils.js +++ b/src/utils.js @@ -233,12 +233,10 @@ function getImportCode( } function getModuleCode( - loaderContext, result, exportType, esModule, sourceMap, - importLoaders, apiImports, urlReplacements, icssReplacements @@ -306,7 +304,6 @@ function dashesCamelCase(str) { } function getExportCode( - loaderContext, exports, exportType, localsConvention, From bba32f674bf8f999109f78fd89a8a215b1d493b9 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 15:45:23 +0300 Subject: [PATCH 02/13] refactor: code --- src/plugins/postcss-url-parser.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/plugins/postcss-url-parser.js b/src/plugins/postcss-url-parser.js index e8493a84..7bab4687 100644 --- a/src/plugins/postcss-url-parser.js +++ b/src/plugins/postcss-url-parser.js @@ -73,7 +73,8 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { const parsed = valueParser(decl.value); walkUrls(parsed, (node, url, needQuotes, isStringValue) => { - if (url.trim().replace(/\\[\r\n]/g, '').length === 0) { + // https://www.w3.org/TR/css-syntax-3/#typedef-url-token + if (url.replace(/^[\s]+|[\s]+$/g, '').length === 0) { result.warn( `Unable to find uri in '${decl ? decl.toString() : decl.value}'`, { node: decl } From a276ebb05734ef305543ac2d8afd9a6f2312c77b Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 15:55:23 +0300 Subject: [PATCH 03/13] refactor: code --- test/__snapshots__/loader.test.js.snap | 15 +++++++++++++++ test/fixtures/invisible-space.css | 1 + test/fixtures/invisible-space.js | 5 +++++ test/loader.test.js | 8 ++++++++ 4 files changed, 29 insertions(+) create mode 100644 test/fixtures/invisible-space.css create mode 100644 test/fixtures/invisible-space.js diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 0f296761..9fefe6db 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -124,6 +124,21 @@ a:hover { exports[`loader should reuse \`ast\` from "postcss-loader": warnings 1`] = `Array []`; +exports[`loader should throw an error on invisible spaces: errors 1`] = ` +Array [ + "ModuleBuildError: Module build failed (from \`replaced original path\`): +CssSyntaxError + +(1:8) Unknown word + +> 1 | a { 

 color: red; 

 } + | ^ +", +] +`; + +exports[`loader should throw an error on invisible spaces: warnings 1`] = `Array []`; + exports[`loader should throw error on invalid css syntax: errors 1`] = ` Array [ "ModuleBuildError: Module build failed (from \`replaced original path\`): diff --git a/test/fixtures/invisible-space.css b/test/fixtures/invisible-space.css new file mode 100644 index 00000000..6d22c4f8 --- /dev/null +++ b/test/fixtures/invisible-space.css @@ -0,0 +1 @@ +a { 

 color: red; 

 } \ No newline at end of file diff --git a/test/fixtures/invisible-space.js b/test/fixtures/invisible-space.js new file mode 100644 index 00000000..0b273d7b --- /dev/null +++ b/test/fixtures/invisible-space.js @@ -0,0 +1,5 @@ +import css from './invisible-space.css'; + +__export__ = css; + +export default css; diff --git a/test/loader.test.js b/test/loader.test.js index 1c16d48d..abe38d07 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -342,4 +342,12 @@ describe('loader', () => { expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); + + it('should throw an error on invisible spaces', async () => { + const compiler = getCompiler('./invisible-space.js'); + const stats = await compile(compiler); + + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); }); From 5a432cda4ae568e5f13d933ff3a53ab60a74a6b5 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 16:31:52 +0300 Subject: [PATCH 04/13] refactor: code --- src/index.js | 5 +- src/plugins/postcss-icss-parser.js | 87 +++++++++++++++------------- src/plugins/postcss-import-parser.js | 6 +- src/utils.js | 10 +--- 4 files changed, 59 insertions(+), 49 deletions(-) diff --git a/src/index.js b/src/index.js index 5e06fbba..c9c69338 100644 --- a/src/index.js +++ b/src/index.js @@ -13,6 +13,7 @@ import Warning from './Warning'; import schema from './options.json'; import { icssParser, importParser, urlParser } from './plugins'; import { + getRequest, getExportCode, getFilter, getImportCode, @@ -38,12 +39,14 @@ export default function loader(content, map, meta) { } const exportType = options.onlyLocals ? 'locals' : 'full'; + const urlHandler = (url) => getRequest(this, options.importLoaders) + url; - plugins.push(icssParser()); + plugins.push(icssParser({ urlHandler })); if (options.import !== false && exportType === 'full') { plugins.push( importParser({ + urlHandler, filter: getFilter(options.import, this.resourcePath), }) ); diff --git a/src/plugins/postcss-icss-parser.js b/src/plugins/postcss-icss-parser.js index e86d0caf..280117fb 100644 --- a/src/plugins/postcss-icss-parser.js +++ b/src/plugins/postcss-icss-parser.js @@ -28,50 +28,57 @@ function makeRequestableIcssImports(icssImports) { }, {}); } -export default postcss.plugin('postcss-icss-parser', () => (css, result) => { - const importReplacements = Object.create(null); - const extractedICSS = extractICSS(css); - const icssImports = makeRequestableIcssImports(extractedICSS.icssImports); - - for (const [importIndex, url] of Object.keys(icssImports).entries()) { - const importName = `___CSS_LOADER_ICSS_IMPORT_${importIndex}___`; - - result.messages.push( - { - type: 'import', - value: { type: 'icss', importName, url }, - }, - { - type: 'api-import', - value: { type: 'internal', importName, dedupe: true }, +export default postcss.plugin( + 'postcss-icss-parser', + (options) => (css, result) => { + const importReplacements = Object.create(null); + const extractedICSS = extractICSS(css); + const icssImports = makeRequestableIcssImports(extractedICSS.icssImports); + + for (const [importIndex, url] of Object.keys(icssImports).entries()) { + const importName = `___CSS_LOADER_ICSS_IMPORT_${importIndex}___`; + + result.messages.push( + { + type: 'import', + value: { + type: 'icss', + importName, + url: options.urlHandler ? options.urlHandler(url) : url, + }, + }, + { + type: 'api-import', + value: { type: 'internal', importName, dedupe: true }, + } + ); + + const tokenMap = icssImports[url]; + const tokens = Object.keys(tokenMap); + + for (const [replacementIndex, token] of tokens.entries()) { + const replacementName = `___CSS_LOADER_ICSS_IMPORT_${importIndex}_REPLACEMENT_${replacementIndex}___`; + const localName = tokenMap[token]; + + importReplacements[token] = replacementName; + + result.messages.push({ + type: 'icss-replacement', + value: { replacementName, importName, localName }, + }); } - ); - - const tokenMap = icssImports[url]; - const tokens = Object.keys(tokenMap); - - for (const [replacementIndex, token] of tokens.entries()) { - const replacementName = `___CSS_LOADER_ICSS_IMPORT_${importIndex}_REPLACEMENT_${replacementIndex}___`; - const localName = tokenMap[token]; - - importReplacements[token] = replacementName; - - result.messages.push({ - type: 'icss-replacement', - value: { replacementName, importName, localName }, - }); } - } - if (Object.keys(importReplacements).length > 0) { - replaceSymbols(css, importReplacements); - } + if (Object.keys(importReplacements).length > 0) { + replaceSymbols(css, importReplacements); + } - const { icssExports } = extractedICSS; + const { icssExports } = extractedICSS; - for (const name of Object.keys(icssExports)) { - const value = replaceValueSymbols(icssExports[name], importReplacements); + for (const name of Object.keys(icssExports)) { + const value = replaceValueSymbols(icssExports[name], importReplacements); - result.messages.push({ type: 'export', value: { name, value } }); + result.messages.push({ type: 'export', value: { name, value } }); + } } -}); +); diff --git a/src/plugins/postcss-import-parser.js b/src/plugins/postcss-import-parser.js index 2399b04e..214bb2e8 100644 --- a/src/plugins/postcss-import-parser.js +++ b/src/plugins/postcss-import-parser.js @@ -108,7 +108,11 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { result.messages.push({ type: 'import', - value: { type: '@import', importName, url }, + value: { + type: '@import', + importName, + url: options.urlHandler ? options.urlHandler(url) : url, + }, }); } diff --git a/src/utils.js b/src/utils.js index c27e4b7c..b9bd475a 100644 --- a/src/utils.js +++ b/src/utils.js @@ -178,7 +178,7 @@ function normalizeSourceMap(map) { return newMap; } -function getImportPrefix(loaderContext, importLoaders) { +function getRequest(loaderContext, importLoaders) { if (importLoaders === false) { return ''; } @@ -217,12 +217,7 @@ function getImportCode( for (const item of imports) { const { importName, url } = item; - const importUrl = stringifyRequest( - loaderContext, - item.type !== 'url' - ? getImportPrefix(loaderContext, importLoaders) + url - : url - ); + const importUrl = stringifyRequest(loaderContext, url); code += esModule ? `import ${importName} from ${importUrl};\n` @@ -390,6 +385,7 @@ export { getFilter, getModulesPlugins, normalizeSourceMap, + getRequest, getImportCode, getModuleCode, getExportCode, From 143d3c5495170c826b3d93b8a3c0b7ca10a5b67f Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 16:33:33 +0300 Subject: [PATCH 05/13] refactor: code --- src/plugins/postcss-icss-parser.js | 1 - src/plugins/postcss-import-parser.js | 1 - src/plugins/postcss-url-parser.js | 7 +------ 3 files changed, 1 insertion(+), 8 deletions(-) diff --git a/src/plugins/postcss-icss-parser.js b/src/plugins/postcss-icss-parser.js index 280117fb..f8023c34 100644 --- a/src/plugins/postcss-icss-parser.js +++ b/src/plugins/postcss-icss-parser.js @@ -42,7 +42,6 @@ export default postcss.plugin( { type: 'import', value: { - type: 'icss', importName, url: options.urlHandler ? options.urlHandler(url) : url, }, diff --git a/src/plugins/postcss-import-parser.js b/src/plugins/postcss-import-parser.js index 214bb2e8..591ee3a9 100644 --- a/src/plugins/postcss-import-parser.js +++ b/src/plugins/postcss-import-parser.js @@ -109,7 +109,6 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { result.messages.push({ type: 'import', value: { - type: '@import', importName, url: options.urlHandler ? options.urlHandler(url) : url, }, diff --git a/src/plugins/postcss-url-parser.js b/src/plugins/postcss-url-parser.js index 7bab4687..ee8c48ed 100644 --- a/src/plugins/postcss-url-parser.js +++ b/src/plugins/postcss-url-parser.js @@ -108,7 +108,6 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { pluginName, type: 'import', value: { - type: 'url', importName: '___CSS_LOADER_GET_URL_IMPORT___', url: require.resolve('../runtime/getUrl.js'), }, @@ -120,11 +119,7 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { result.messages.push({ pluginName, type: 'import', - value: { - type: 'url', - importName, - url: normalizedUrl, - }, + value: { importName, url: normalizedUrl }, }); } From 2f67e17eb9233a28832f5d6bd319fdb979009dde Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 16:43:46 +0300 Subject: [PATCH 06/13] refactor: code --- src/index.js | 6 ++++-- src/plugins/postcss-url-parser.js | 13 +++++++++++-- src/utils.js | 5 ++--- 3 files changed, 17 insertions(+), 7 deletions(-) diff --git a/src/index.js b/src/index.js index c9c69338..d5a6eb87 100644 --- a/src/index.js +++ b/src/index.js @@ -2,7 +2,7 @@ MIT License http://www.opensource.org/licenses/mit-license.php Author Tobias Koppers @sokra */ -import { getOptions, isUrlRequest } from 'loader-utils'; +import { getOptions, isUrlRequest, stringifyRequest } from 'loader-utils'; import postcss from 'postcss'; import postcssPkg from 'postcss/package.json'; import validateOptions from 'schema-utils'; @@ -39,7 +39,8 @@ export default function loader(content, map, meta) { } const exportType = options.onlyLocals ? 'locals' : 'full'; - const urlHandler = (url) => getRequest(this, options.importLoaders) + url; + const urlHandler = (url) => + stringifyRequest(this, getRequest(this, options.importLoaders) + url); plugins.push(icssParser({ urlHandler })); @@ -55,6 +56,7 @@ export default function loader(content, map, meta) { if (options.url !== false && exportType === 'full') { plugins.push( urlParser({ + urlHandler: (url) => stringifyRequest(this, url), filter: getFilter(options.url, this.resourcePath, (value) => isUrlRequest(value) ), diff --git a/src/plugins/postcss-url-parser.js b/src/plugins/postcss-url-parser.js index ee8c48ed..54de6d8a 100644 --- a/src/plugins/postcss-url-parser.js +++ b/src/plugins/postcss-url-parser.js @@ -104,12 +104,16 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { importsMap.set(importKey, importName); if (!hasHelper) { + const urlToHelper = require.resolve('../runtime/getUrl.js'); + result.messages.push({ pluginName, type: 'import', value: { importName: '___CSS_LOADER_GET_URL_IMPORT___', - url: require.resolve('../runtime/getUrl.js'), + url: options.urlHandler + ? options.urlHandler(urlToHelper) + : urlToHelper, }, }); @@ -119,7 +123,12 @@ export default postcss.plugin(pluginName, (options) => (css, result) => { result.messages.push({ pluginName, type: 'import', - value: { importName, url: normalizedUrl }, + value: { + importName, + url: options.urlHandler + ? options.urlHandler(normalizedUrl) + : normalizedUrl, + }, }); } diff --git a/src/utils.js b/src/utils.js index b9bd475a..0e355404 100644 --- a/src/utils.js +++ b/src/utils.js @@ -217,11 +217,10 @@ function getImportCode( for (const item of imports) { const { importName, url } = item; - const importUrl = stringifyRequest(loaderContext, url); code += esModule - ? `import ${importName} from ${importUrl};\n` - : `var ${importName} = require(${importUrl});\n`; + ? `import ${importName} from ${url};\n` + : `var ${importName} = require(${url});\n`; } return code ? `// Imports\n${code}` : ''; From f08ed2744d828877264ba517952dd63f67188a9c Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 16:52:15 +0300 Subject: [PATCH 07/13] refactor: code --- src/index.js | 7 ++++++- src/utils.js | 4 ---- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/src/index.js b/src/index.js index d5a6eb87..2b486566 100644 --- a/src/index.js +++ b/src/index.js @@ -40,7 +40,12 @@ export default function loader(content, map, meta) { const exportType = options.onlyLocals ? 'locals' : 'full'; const urlHandler = (url) => - stringifyRequest(this, getRequest(this, options.importLoaders) + url); + stringifyRequest( + this, + options.importLoaders === false + ? url + : getRequest(this, options.importLoaders) + url + ); plugins.push(icssParser({ urlHandler })); diff --git a/src/utils.js b/src/utils.js index 0e355404..c04dc574 100644 --- a/src/utils.js +++ b/src/utils.js @@ -179,10 +179,6 @@ function normalizeSourceMap(map) { } function getRequest(loaderContext, importLoaders) { - if (importLoaders === false) { - return ''; - } - const numberImportedLoaders = parseInt(importLoaders, 10) || 0; const loadersRequest = loaderContext.loaders .slice( From 65079b7e3658f17b89cf14effe5889d42ee9a449 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 16:52:38 +0300 Subject: [PATCH 08/13] refactor: code --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 2b486566..c67f4bc6 100644 --- a/src/index.js +++ b/src/index.js @@ -52,8 +52,8 @@ export default function loader(content, map, meta) { if (options.import !== false && exportType === 'full') { plugins.push( importParser({ - urlHandler, filter: getFilter(options.import, this.resourcePath), + urlHandler, }) ); } @@ -61,10 +61,10 @@ export default function loader(content, map, meta) { if (options.url !== false && exportType === 'full') { plugins.push( urlParser({ - urlHandler: (url) => stringifyRequest(this, url), filter: getFilter(options.url, this.resourcePath, (value) => isUrlRequest(value) ), + urlHandler: (url) => stringifyRequest(this, url), }) ); } From 4cab5de9b53afa88fa510640c5cd26db5b440023 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 17:26:01 +0300 Subject: [PATCH 09/13] refactor: code --- src/index.js | 10 +--- src/utils.js | 36 ++++++++---- .../importLoaders-option.test.js.snap | 55 +++++++++++++++++++ .../fixtures/nested-import/other-imported.css | 4 ++ test/fixtures/nested-import/source.css | 1 + 5 files changed, 87 insertions(+), 19 deletions(-) create mode 100644 test/fixtures/nested-import/other-imported.css diff --git a/src/index.js b/src/index.js index c67f4bc6..6bd4d251 100644 --- a/src/index.js +++ b/src/index.js @@ -13,7 +13,7 @@ import Warning from './Warning'; import schema from './options.json'; import { icssParser, importParser, urlParser } from './plugins'; import { - getRequest, + getPreRequester, getExportCode, getFilter, getImportCode, @@ -39,13 +39,9 @@ export default function loader(content, map, meta) { } const exportType = options.onlyLocals ? 'locals' : 'full'; + const preRequester = getPreRequester(this); const urlHandler = (url) => - stringifyRequest( - this, - options.importLoaders === false - ? url - : getRequest(this, options.importLoaders) + url - ); + stringifyRequest(this, preRequester(options.importLoaders) + url); plugins.push(icssParser({ urlHandler })); diff --git a/src/utils.js b/src/utils.js index c04dc574..0fc77aa3 100644 --- a/src/utils.js +++ b/src/utils.js @@ -178,17 +178,29 @@ function normalizeSourceMap(map) { return newMap; } -function getRequest(loaderContext, importLoaders) { - const numberImportedLoaders = parseInt(importLoaders, 10) || 0; - const loadersRequest = loaderContext.loaders - .slice( - loaderContext.loaderIndex, - loaderContext.loaderIndex + 1 + numberImportedLoaders - ) - .map((x) => x.request) - .join('!'); - - return `-!${loadersRequest}!`; +function getPreRequester(loaderContext) { + const { loaders, loaderIndex } = loaderContext; + const cache = Object.create(null); + + return (number) => { + if (cache[number]) { + return cache[number]; + } + + if (number === false) { + cache[number] = ''; + } else { + const numberImportedLoaders = parseInt(number, 10) || 0; + const loadersRequest = loaders + .slice(loaderIndex, loaderIndex + 1 + numberImportedLoaders) + .map((x) => x.request) + .join('!'); + + cache[number] = `-!${loadersRequest}!`; + } + + return cache[number]; + }; } function getImportCode( @@ -380,7 +392,7 @@ export { getFilter, getModulesPlugins, normalizeSourceMap, - getRequest, + getPreRequester, getImportCode, getModuleCode, getExportCode, diff --git a/test/__snapshots__/importLoaders-option.test.js.snap b/test/__snapshots__/importLoaders-option.test.js.snap index ec9a1d38..ce0c790b 100644 --- a/test/__snapshots__/importLoaders-option.test.js.snap +++ b/test/__snapshots__/importLoaders-option.test.js.snap @@ -6,8 +6,10 @@ exports[`"importLoaders" option should work when not specified: module 1`] = ` "// Imports var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js!./imported.css\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_1___ = require(\\"-!../../../src/index.js!./other-imported.css\\"); exports = ___CSS_LOADER_API_IMPORT___(false); exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_1___); // Module exports.push([module.id, \\".foo {\\\\n color: red;\\\\n color: rgba(0, 0, 255, 0.9);\\\\n}\\\\n\\", \\"\\"]); // Exports @@ -23,6 +25,15 @@ Array [ color: blue; color: rgb(0 0 100% / 90%); } +", + "", + ], + Array [ + "../../src/index.js!./nested-import/other-imported.css", + ".baz { + color: green; + color: rgb(0 0 100% / 90%); +} ", "", ], @@ -46,8 +57,10 @@ exports[`"importLoaders" option should work with a value equal to "0" (\`postcss "// Imports var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_1___ = require(\\"-!../../../src/index.js??[ident]!./other-imported.css\\"); exports = ___CSS_LOADER_API_IMPORT___(false); exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_1___); // Module exports.push([module.id, \\".foo {\\\\n color: red;\\\\n color: rgba(0, 0, 255, 0.9);\\\\n}\\\\n\\", \\"\\"]); // Exports @@ -63,6 +76,15 @@ Array [ color: blue; color: rgb(0 0 100% / 90%); } +", + "", + ], + Array [ + "../../src/index.js?[ident]!./nested-import/other-imported.css", + ".baz { + color: green; + color: rgb(0 0 100% / 90%); +} ", "", ], @@ -86,8 +108,10 @@ exports[`"importLoaders" option should work with a value equal to "1" ("postcss- "// Imports var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_1___ = require(\\"-!../../../src/index.js??[ident]!./other-imported.css\\"); exports = ___CSS_LOADER_API_IMPORT___(false); exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_1___); // Module exports.push([module.id, \\".foo {\\\\n color: red;\\\\n color: rgba(0, 0, 255, 0.9);\\\\n}\\\\n\\", \\"\\"]); // Exports @@ -103,6 +127,15 @@ Array [ color: blue; color: rgba(0, 0, 255, 0.9); } +", + "", + ], + Array [ + "../../src/index.js?[ident]!./nested-import/other-imported.css", + ".baz { + color: green; + color: rgba(0, 0, 255, 0.9); +} ", "", ], @@ -126,8 +159,10 @@ exports[`"importLoaders" option should work with a value equal to "1" (no loader "// Imports var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_1___ = require(\\"-!../../../src/index.js??[ident]!./other-imported.css\\"); exports = ___CSS_LOADER_API_IMPORT___(false); exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_1___); // Module exports.push([module.id, \\".foo {\\\\n color: red;\\\\n color: rgb(0 0 100% / 90%);\\\\n}\\\\n\\", \\"\\"]); // Exports @@ -143,6 +178,15 @@ Array [ color: blue; color: rgb(0 0 100% / 90%); } +", + "", + ], + Array [ + "../../src/index.js?[ident]!./nested-import/other-imported.css", + ".baz { + color: green; + color: rgb(0 0 100% / 90%); +} ", "", ], @@ -166,8 +210,10 @@ exports[`"importLoaders" option should work with a value equal to "2" ("postcss- "// Imports var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../src/runtime/api.js\\"); var ___CSS_LOADER_AT_RULE_IMPORT_0___ = require(\\"-!../../../src/index.js??[ident]!./imported.css\\"); +var ___CSS_LOADER_AT_RULE_IMPORT_1___ = require(\\"-!../../../src/index.js??[ident]!./other-imported.css\\"); exports = ___CSS_LOADER_API_IMPORT___(false); exports.i(___CSS_LOADER_AT_RULE_IMPORT_0___); +exports.i(___CSS_LOADER_AT_RULE_IMPORT_1___); // Module exports.push([module.id, \\".foo {\\\\n color: red;\\\\n color: rgba(0, 0, 255, 0.9);\\\\n}\\\\n\\", \\"\\"]); // Exports @@ -183,6 +229,15 @@ Array [ color: blue; color: rgba(0, 0, 255, 0.9); } +", + "", + ], + Array [ + "../../src/index.js?[ident]!./nested-import/other-imported.css", + ".baz { + color: green; + color: rgba(0, 0, 255, 0.9); +} ", "", ], diff --git a/test/fixtures/nested-import/other-imported.css b/test/fixtures/nested-import/other-imported.css new file mode 100644 index 00000000..051e9d94 --- /dev/null +++ b/test/fixtures/nested-import/other-imported.css @@ -0,0 +1,4 @@ +.baz { + color: green; + color: rgb(0 0 100% / 90%); +} diff --git a/test/fixtures/nested-import/source.css b/test/fixtures/nested-import/source.css index 25fa4ca1..6aeedd42 100644 --- a/test/fixtures/nested-import/source.css +++ b/test/fixtures/nested-import/source.css @@ -1,4 +1,5 @@ @import './imported.css'; +@import './other-imported.css'; .foo { color: red; From c3523e47135a428f5c440777fc9611038436004e Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 17:33:10 +0300 Subject: [PATCH 10/13] refactor: code --- src/options.json | 2 +- src/utils.js | 6 ++++-- test/__snapshots__/validate-options.test.js.snap | 14 ++++++++++++-- test/validate-options.test.js | 2 +- 4 files changed, 18 insertions(+), 6 deletions(-) diff --git a/src/options.json b/src/options.json index e3125073..77015844 100644 --- a/src/options.json +++ b/src/options.json @@ -83,7 +83,7 @@ "type": "boolean" }, { - "type": "number" + "type": "integer" } ] }, diff --git a/src/utils.js b/src/utils.js index 0fc77aa3..265236b5 100644 --- a/src/utils.js +++ b/src/utils.js @@ -190,9 +190,11 @@ function getPreRequester(loaderContext) { if (number === false) { cache[number] = ''; } else { - const numberImportedLoaders = parseInt(number, 10) || 0; const loadersRequest = loaders - .slice(loaderIndex, loaderIndex + 1 + numberImportedLoaders) + .slice( + loaderIndex, + loaderIndex + 1 + (typeof number !== 'number' ? 0 : number) + ) .map((x) => x.request) .join('!'); diff --git a/test/__snapshots__/validate-options.test.js.snap b/test/__snapshots__/validate-options.test.js.snap index 4a8e10e8..f65d36cc 100644 --- a/test/__snapshots__/validate-options.test.js.snap +++ b/test/__snapshots__/validate-options.test.js.snap @@ -19,11 +19,21 @@ exports[`validate options should throw an error on the "import" option with "tru exports[`validate options should throw an error on the "importLoaders" option with "1" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.importLoaders should be one of these: - boolean | number + boolean | integer -> Enables/Disables or setups number of loaders applied before CSS loader (https://github.com/webpack-contrib/css-loader#importloaders). Details: * options.importLoaders should be a boolean. - * options.importLoaders should be a number." + * options.importLoaders should be a integer." +`; + +exports[`validate options should throw an error on the "importLoaders" option with "2.5" value 1`] = ` +"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. + - options.importLoaders should be one of these: + boolean | integer + -> Enables/Disables or setups number of loaders applied before CSS loader (https://github.com/webpack-contrib/css-loader#importloaders). + Details: + * options.importLoaders should be a boolean. + * options.importLoaders should be a integer." `; exports[`validate options should throw an error on the "localsConvention" option with "unknown" value 1`] = ` diff --git a/test/validate-options.test.js b/test/validate-options.test.js index 814ee799..969765e4 100644 --- a/test/validate-options.test.js +++ b/test/validate-options.test.js @@ -53,7 +53,7 @@ describe('validate options', () => { }, importLoaders: { success: [false, 0, 1, 2], - failure: ['1'], + failure: ['1', 2.5], }, onlyLocals: { success: [true, false], From 09956a4531bd7dcebc1cdefa66744cbf3b5dd109 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Tue, 24 Mar 2020 17:36:48 +0300 Subject: [PATCH 11/13] refactor: code --- src/index.js | 14 ++++---------- src/utils.js | 12 +++--------- 2 files changed, 7 insertions(+), 19 deletions(-) diff --git a/src/index.js b/src/index.js index 6bd4d251..c4e08cf6 100644 --- a/src/index.js +++ b/src/index.js @@ -124,25 +124,19 @@ export default function loader(content, map, meta) { } } - const { importLoaders, localsConvention } = options; + const { localsConvention } = options; const esModule = typeof options.esModule !== 'undefined' ? options.esModule : false; - const importCode = getImportCode( - this, - imports, - exportType, - importLoaders, - esModule - ); + const importCode = getImportCode(this, exportType, imports, esModule); const moduleCode = getModuleCode( result, exportType, - esModule, sourceMap, apiImports, urlReplacements, - icssReplacements + icssReplacements, + esModule ); const exportCode = getExportCode( exports, diff --git a/src/utils.js b/src/utils.js index 265236b5..31dc1031 100644 --- a/src/utils.js +++ b/src/utils.js @@ -205,13 +205,7 @@ function getPreRequester(loaderContext) { }; } -function getImportCode( - loaderContext, - imports, - exportType, - importLoaders, - esModule -) { +function getImportCode(loaderContext, exportType, imports, esModule) { let code = ''; if (exportType === 'full') { @@ -239,11 +233,11 @@ function getImportCode( function getModuleCode( result, exportType, - esModule, sourceMap, apiImports, urlReplacements, - icssReplacements + icssReplacements, + esModule ) { if (exportType !== 'full') { return ''; From 25bb41d65c219ff886647d70eb153f86aa7bc656 Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Wed, 25 Mar 2020 14:54:50 +0300 Subject: [PATCH 12/13] refactor: code --- src/utils.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/utils.js b/src/utils.js index 31dc1031..cd53cbeb 100644 --- a/src/utils.js +++ b/src/utils.js @@ -178,8 +178,7 @@ function normalizeSourceMap(map) { return newMap; } -function getPreRequester(loaderContext) { - const { loaders, loaderIndex } = loaderContext; +function getPreRequester({ loaders, loaderIndex }) { const cache = Object.create(null); return (number) => { From fa70fbacf3ee1eb6d5a0e50f0c1de37f60eacd5b Mon Sep 17 00:00:00 2001 From: evilebottnawi Date: Wed, 25 Mar 2020 15:47:30 +0300 Subject: [PATCH 13/13] refactor: code --- test/loader.test.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/test/loader.test.js b/test/loader.test.js index abe38d07..af438628 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -11,6 +11,8 @@ import { getWarnings, } from './helpers/index'; +jest.setTimeout(10000); + describe('loader', () => { it('should work', async () => { const compiler = getCompiler('./basic.js');