From f23954c94bb96053d383057302082208629a01f6 Mon Sep 17 00:00:00 2001 From: cap-Bernardito Date: Thu, 2 Apr 2020 19:12:16 +0300 Subject: [PATCH 1/4] feat: modules.mode callback function (Issue #1063) --- src/options.json | 9 +- src/utils.js | 62 +++++++---- .../__snapshots__/modules-option.test.js.snap | 102 ++++++++++++++++++ .../validate-options.test.js.snap | 48 +++++++-- test/fixtures/modules/issue-1063/global.css | 7 ++ .../fixtures/modules/issue-1063/issue-1063.js | 6 ++ test/fixtures/modules/issue-1063/local.css | 7 ++ test/modules-option.test.js | 50 +++++++++ test/validate-options.test.js | 1 + 9 files changed, 260 insertions(+), 32 deletions(-) create mode 100644 test/fixtures/modules/issue-1063/global.css create mode 100644 test/fixtures/modules/issue-1063/issue-1063.js create mode 100644 test/fixtures/modules/issue-1063/local.css diff --git a/src/options.json b/src/options.json index 77015844..742c28ce 100644 --- a/src/options.json +++ b/src/options.json @@ -37,7 +37,14 @@ "additionalProperties": false, "properties": { "mode": { - "enum": ["local", "global", "pure"] + "anyOf": [ + { + "enum": ["local", "global", "pure"] + }, + { + "instanceof": "Function" + } + ] }, "localIdentName": { "type": "string" diff --git a/src/utils.js b/src/utils.js index cd53cbeb..0bfed952 100644 --- a/src/utils.js +++ b/src/utils.js @@ -115,25 +115,24 @@ function getModulesPlugins(options, loaderContext) { modulesOptions = Object.assign({}, modulesOptions, options.modules); } - return [ - modulesValues, - localByDefault({ mode: modulesOptions.mode }), - extractImports(), - modulesScope({ - generateScopedName: function generateScopedName(exportName) { - let localIdent = modulesOptions.getLocalIdent( - loaderContext, - modulesOptions.localIdentName, - exportName, - { - context: modulesOptions.context, - hashPrefix: modulesOptions.hashPrefix, - regExp: modulesOptions.localIdentRegExp, - } - ); + if (typeof modulesOptions.mode === 'function') { + const modeFromFunction = modulesOptions.mode(loaderContext.resourcePath); + + if (modeFromFunction === 'local' || modeFromFunction === 'global') { + modulesOptions.mode = modeFromFunction; + } + } + + let plugins = []; - if (!localIdent) { - localIdent = getLocalIdent( + try { + plugins = [ + modulesValues, + localByDefault({ mode: modulesOptions.mode }), + extractImports(), + modulesScope({ + generateScopedName: function generateScopedName(exportName) { + let localIdent = modulesOptions.getLocalIdent( loaderContext, modulesOptions.localIdentName, exportName, @@ -143,12 +142,29 @@ function getModulesPlugins(options, loaderContext) { regExp: modulesOptions.localIdentRegExp, } ); - } - return localIdent; - }, - }), - ]; + if (!localIdent) { + localIdent = getLocalIdent( + loaderContext, + modulesOptions.localIdentName, + exportName, + { + context: modulesOptions.context, + hashPrefix: modulesOptions.hashPrefix, + regExp: modulesOptions.localIdentRegExp, + } + ); + } + + return localIdent; + }, + }), + ]; + } catch (error) { + loaderContext.emitError(error); + } + + return plugins; } function normalizeSourceMap(map) { diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap index 85e61ce9..06f58f11 100644 --- a/test/__snapshots__/modules-option.test.js.snap +++ b/test/__snapshots__/modules-option.test.js.snap @@ -363,6 +363,108 @@ div:not(.\\\\1F600) { exports[`"modules" option issue #995: warnings 1`] = `Array []`; +exports[`"modules" option issue #1063 throw error: errors 1`] = ` +Array [ + "ModuleError: Module Error (from \`replaced original path\`): +options.mode must be either \\"global\\", \\"local\\" or \\"pure\\" (default \\"local\\")", + "ModuleError: Module Error (from \`replaced original path\`): +options.mode must be either \\"global\\", \\"local\\" or \\"pure\\" (default \\"local\\")", +] +`; + +exports[`"modules" option issue #1063 throw error: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:global(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`"modules" option issue #1063 throw error: module 2`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:local(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +module.exports = exports; +" +`; + +exports[`"modules" option issue #1063 throw error: result 1`] = ` +".className { + color: green; +} + +:global(.otherClass) { + color: blue; +} +.className { + color: green; +} + +:local(.otherClass) { + color: blue; +} +" +`; + +exports[`"modules" option issue #1063 throw error: warnings 1`] = `Array []`; + +exports[`"modules" option issue #1063: errors 1`] = `Array []`; + +exports[`"modules" option issue #1063: module 1`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\"._1iR-jQngOXizCZOLZck-4P {\\\\n color: green;\\\\n}\\\\n\\\\n.otherClass {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +exports.locals = { + \\"className\\": \\"_1iR-jQngOXizCZOLZck-4P\\" +}; +module.exports = exports; +" +`; + +exports[`"modules" option issue #1063: module 2`] = ` +"// Imports +var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); +exports = ___CSS_LOADER_API_IMPORT___(false); +// Module +exports.push([module.id, \\"._2WZy6LhVz_KGVbdNCAmL6C {\\\\n color: green;\\\\n}\\\\n\\\\n._7mafm73rmgiKuViZtzNmn {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +// Exports +exports.locals = { + \\"className\\": \\"_2WZy6LhVz_KGVbdNCAmL6C\\", + \\"otherClass\\": \\"_7mafm73rmgiKuViZtzNmn\\" +}; +module.exports = exports; +" +`; + +exports[`"modules" option issue #1063: result 1`] = ` +"._1iR-jQngOXizCZOLZck-4P { + color: green; +} + +.otherClass { + color: blue; +} +._2WZy6LhVz_KGVbdNCAmL6C { + color: green; +} + +._7mafm73rmgiKuViZtzNmn { + color: blue; +} +" +`; + +exports[`"modules" option issue #1063: warnings 1`] = `Array []`; + exports[`"modules" option should avoid unnecessary "require": errors 1`] = `Array []`; exports[`"modules" option should avoid unnecessary "require": module 1`] = ` diff --git a/test/__snapshots__/validate-options.test.js.snap b/test/__snapshots__/validate-options.test.js.snap index f65d36cc..e7f0351f 100644 --- a/test/__snapshots__/validate-options.test.js.snap +++ b/test/__snapshots__/validate-options.test.js.snap @@ -86,26 +86,58 @@ exports[`validate options should throw an error on the "modules" option with "{" exports[`validate options should throw an error on the "modules" option with "{"mode":"globals"}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - - options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\"" + - options.modules should be one of these: + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? } + -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" | function + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" + * options.modules.mode should be an instance of function." `; exports[`validate options should throw an error on the "modules" option with "{"mode":"locals"}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - - options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\"" + - options.modules should be one of these: + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? } + -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" | function + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" + * options.modules.mode should be an instance of function." `; exports[`validate options should throw an error on the "modules" option with "{"mode":"pures"}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - - options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\"" + - options.modules should be one of these: + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? } + -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" | function + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" + * options.modules.mode should be an instance of function." `; exports[`validate options should throw an error on the "modules" option with "{"mode":true}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - - options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\"" + - options.modules should be one of these: + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? } + -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" | function + Details: + * options.modules.mode should be one of these: + \\"local\\" | \\"global\\" | \\"pure\\" + * options.modules.mode should be an instance of function." `; exports[`validate options should throw an error on the "modules" option with "globals" value 1`] = ` diff --git a/test/fixtures/modules/issue-1063/global.css b/test/fixtures/modules/issue-1063/global.css new file mode 100644 index 00000000..07fafd0b --- /dev/null +++ b/test/fixtures/modules/issue-1063/global.css @@ -0,0 +1,7 @@ +.className { + color: green; +} + +:local(.otherClass) { + color: blue; +} diff --git a/test/fixtures/modules/issue-1063/issue-1063.js b/test/fixtures/modules/issue-1063/issue-1063.js new file mode 100644 index 00000000..c602c8c7 --- /dev/null +++ b/test/fixtures/modules/issue-1063/issue-1063.js @@ -0,0 +1,6 @@ +import css1 from './local.css'; +import css2 from './global.css'; + +__export__ = css1 + css2; + +export default css1 + css2; diff --git a/test/fixtures/modules/issue-1063/local.css b/test/fixtures/modules/issue-1063/local.css new file mode 100644 index 00000000..e5089557 --- /dev/null +++ b/test/fixtures/modules/issue-1063/local.css @@ -0,0 +1,7 @@ +.className { + color: green; +} + +:global(.otherClass) { + color: blue; +} diff --git a/test/modules-option.test.js b/test/modules-option.test.js index 6ba9d5fb..e819a187 100644 --- a/test/modules-option.test.js +++ b/test/modules-option.test.js @@ -565,4 +565,54 @@ describe('"modules" option', () => { expect(getWarnings(stats)).toMatchSnapshot('warnings'); expect(getErrors(stats)).toMatchSnapshot('errors'); }); + + it('issue #1063', async () => { + const compiler = getCompiler('./modules/issue-1063/issue-1063.js', { + modules: { + mode: (resourcePath) => { + if (resourcePath === 'global.css') { + return 'global'; + } + + return 'local'; + }, + }, + }); + const stats = await compile(compiler); + + expect( + getModuleSource('./modules/issue-1063/local.css', stats) + ).toMatchSnapshot('module'); + expect( + getModuleSource('./modules/issue-1063/global.css', stats) + ).toMatchSnapshot('module'); + expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot( + 'result' + ); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it('issue #1063 throw error', async () => { + const compiler = getCompiler('./modules/issue-1063/issue-1063.js', { + modules: { + mode: () => { + return 'not local, global or pure'; + }, + }, + }); + const stats = await compile(compiler); + + expect( + getModuleSource('./modules/issue-1063/local.css', stats) + ).toMatchSnapshot('module'); + expect( + getModuleSource('./modules/issue-1063/global.css', stats) + ).toMatchSnapshot('module'); + expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot( + 'result' + ); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); }); diff --git a/test/validate-options.test.js b/test/validate-options.test.js index 969765e4..db5ad6cd 100644 --- a/test/validate-options.test.js +++ b/test/validate-options.test.js @@ -20,6 +20,7 @@ describe('validate options', () => { { mode: 'global' }, { mode: 'local' }, { mode: 'pure' }, + { mode: () => 'local' }, { localIdentName: '[path][name]__[local]--[hash:base64:5]' }, { context: 'context' }, { hashPrefix: 'hash' }, From de3a09cfac13cdc88914e605e3c9c348cae7ba63 Mon Sep 17 00:00:00 2001 From: cap-Bernardito Date: Sat, 4 Apr 2020 12:28:25 +0300 Subject: [PATCH 2/4] feat: auto resolving css-modules import (Issue #994) --- README.md | 43 ++++++++++++++++++- .../__snapshots__/modules-option.test.js.snap | 37 ++++++++-------- test/fixtures/modules/issue-1063/global.css | 8 ++-- test/fixtures/modules/issue-1063/local.css | 4 +- test/modules-option.test.js | 2 +- 5 files changed, 67 insertions(+), 27 deletions(-) diff --git a/README.md b/README.md index 8020201e..0d9f7fb7 100644 --- a/README.md +++ b/README.md @@ -541,11 +541,17 @@ module.exports = { ##### `mode` -Type: `String` +Type: `String|Function` Default: `'local'` Setup `mode` option. You can omit the value when you want `local` mode. +###### `String` + +Possible values: + +`local`, `global`, `pure` + **webpack.config.js** ```js @@ -566,6 +572,41 @@ module.exports = { }; ``` +###### `Function` + +Allows set different values modules.mode based on filename + +Possible return values: + +`local`, `global`, `pure` + +**webpack.config.js** + +```js +module.exports = { + module: { + rules: [ + { + test: /\.css$/i, + loader: 'css-loader', + options: { + modules: { + // Callback must return "local", "global" or "pure" + mode: (filename) => { + if (/global.css$/i.test(filename)) { + return 'global'; + } + + return 'local'; + }, + }, + }, + }, + ], + }, +}; +``` + ##### `localIdentName` Type: `String` diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap index 06f58f11..ae8349df 100644 --- a/test/__snapshots__/modules-option.test.js.snap +++ b/test/__snapshots__/modules-option.test.js.snap @@ -377,7 +377,7 @@ exports[`"modules" option issue #1063 throw error: module 1`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:global(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameLocalFile {\\\\n color: green;\\\\n}\\\\n\\\\n:global(.otherClassLocalFile) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); // Exports module.exports = exports; " @@ -388,26 +388,26 @@ exports[`"modules" option issue #1063 throw error: module 2`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:local(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n:local(.otherClassGlobalFile) {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]); // Exports module.exports = exports; " `; exports[`"modules" option issue #1063 throw error: result 1`] = ` -".className { +".classNameLocalFile { color: green; } -:global(.otherClass) { +:global(.otherClassLocalFile) { color: blue; } -.className { - color: green; +.classNameGlobalFile { + color: black; } -:local(.otherClass) { - color: blue; +:local(.otherClassGlobalFile) { + color: coral; } " `; @@ -421,10 +421,10 @@ exports[`"modules" option issue #1063: module 1`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\"._1iR-jQngOXizCZOLZck-4P {\\\\n color: green;\\\\n}\\\\n\\\\n.otherClass {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\"._2cZDGA9F7Kx1vfQmWcLP51 {\\\\n color: green;\\\\n}\\\\n\\\\n.otherClassLocalFile {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); // Exports exports.locals = { - \\"className\\": \\"_1iR-jQngOXizCZOLZck-4P\\" + \\"classNameLocalFile\\": \\"_2cZDGA9F7Kx1vfQmWcLP51\\" }; module.exports = exports; " @@ -435,30 +435,29 @@ exports[`"modules" option issue #1063: module 2`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\"._2WZy6LhVz_KGVbdNCAmL6C {\\\\n color: green;\\\\n}\\\\n\\\\n._7mafm73rmgiKuViZtzNmn {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n._2rcag09JpwrP4_hfyyRmm- {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]); // Exports exports.locals = { - \\"className\\": \\"_2WZy6LhVz_KGVbdNCAmL6C\\", - \\"otherClass\\": \\"_7mafm73rmgiKuViZtzNmn\\" + \\"otherClassGlobalFile\\": \\"_2rcag09JpwrP4_hfyyRmm-\\" }; module.exports = exports; " `; exports[`"modules" option issue #1063: result 1`] = ` -"._1iR-jQngOXizCZOLZck-4P { +"._2cZDGA9F7Kx1vfQmWcLP51 { color: green; } -.otherClass { +.otherClassLocalFile { color: blue; } -._2WZy6LhVz_KGVbdNCAmL6C { - color: green; +.classNameGlobalFile { + color: black; } -._7mafm73rmgiKuViZtzNmn { - color: blue; +._2rcag09JpwrP4_hfyyRmm- { + color: coral; } " `; diff --git a/test/fixtures/modules/issue-1063/global.css b/test/fixtures/modules/issue-1063/global.css index 07fafd0b..95eb9774 100644 --- a/test/fixtures/modules/issue-1063/global.css +++ b/test/fixtures/modules/issue-1063/global.css @@ -1,7 +1,7 @@ -.className { - color: green; +.classNameGlobalFile { + color: black; } -:local(.otherClass) { - color: blue; +:local(.otherClassGlobalFile) { + color: coral; } diff --git a/test/fixtures/modules/issue-1063/local.css b/test/fixtures/modules/issue-1063/local.css index e5089557..f68ef05a 100644 --- a/test/fixtures/modules/issue-1063/local.css +++ b/test/fixtures/modules/issue-1063/local.css @@ -1,7 +1,7 @@ -.className { +.classNameLocalFile { color: green; } -:global(.otherClass) { +:global(.otherClassLocalFile) { color: blue; } diff --git a/test/modules-option.test.js b/test/modules-option.test.js index e819a187..b62a7084 100644 --- a/test/modules-option.test.js +++ b/test/modules-option.test.js @@ -570,7 +570,7 @@ describe('"modules" option', () => { const compiler = getCompiler('./modules/issue-1063/issue-1063.js', { modules: { mode: (resourcePath) => { - if (resourcePath === 'global.css') { + if (/global.css$/i.test(resourcePath)) { return 'global'; } From 25f5a7c9cd66f324125dbc1776b13fd4ffb7e7c8 Mon Sep 17 00:00:00 2001 From: cap-Bernardito Date: Sat, 4 Apr 2020 16:52:07 +0300 Subject: [PATCH 3/4] feat: modules.mode callback function --- README.md | 43 ++++++++++++++++++- .../__snapshots__/modules-option.test.js.snap | 37 ++++++++-------- test/fixtures/modules/issue-1063/global.css | 8 ++-- test/fixtures/modules/issue-1063/local.css | 4 +- test/modules-option.test.js | 2 +- 5 files changed, 67 insertions(+), 27 deletions(-) diff --git a/README.md b/README.md index 8020201e..0d9f7fb7 100644 --- a/README.md +++ b/README.md @@ -541,11 +541,17 @@ module.exports = { ##### `mode` -Type: `String` +Type: `String|Function` Default: `'local'` Setup `mode` option. You can omit the value when you want `local` mode. +###### `String` + +Possible values: + +`local`, `global`, `pure` + **webpack.config.js** ```js @@ -566,6 +572,41 @@ module.exports = { }; ``` +###### `Function` + +Allows set different values modules.mode based on filename + +Possible return values: + +`local`, `global`, `pure` + +**webpack.config.js** + +```js +module.exports = { + module: { + rules: [ + { + test: /\.css$/i, + loader: 'css-loader', + options: { + modules: { + // Callback must return "local", "global" or "pure" + mode: (filename) => { + if (/global.css$/i.test(filename)) { + return 'global'; + } + + return 'local'; + }, + }, + }, + }, + ], + }, +}; +``` + ##### `localIdentName` Type: `String` diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap index 06f58f11..ae8349df 100644 --- a/test/__snapshots__/modules-option.test.js.snap +++ b/test/__snapshots__/modules-option.test.js.snap @@ -377,7 +377,7 @@ exports[`"modules" option issue #1063 throw error: module 1`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:global(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameLocalFile {\\\\n color: green;\\\\n}\\\\n\\\\n:global(.otherClassLocalFile) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); // Exports module.exports = exports; " @@ -388,26 +388,26 @@ exports[`"modules" option issue #1063 throw error: module 2`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\".className {\\\\n color: green;\\\\n}\\\\n\\\\n:local(.otherClass) {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n:local(.otherClassGlobalFile) {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]); // Exports module.exports = exports; " `; exports[`"modules" option issue #1063 throw error: result 1`] = ` -".className { +".classNameLocalFile { color: green; } -:global(.otherClass) { +:global(.otherClassLocalFile) { color: blue; } -.className { - color: green; +.classNameGlobalFile { + color: black; } -:local(.otherClass) { - color: blue; +:local(.otherClassGlobalFile) { + color: coral; } " `; @@ -421,10 +421,10 @@ exports[`"modules" option issue #1063: module 1`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\"._1iR-jQngOXizCZOLZck-4P {\\\\n color: green;\\\\n}\\\\n\\\\n.otherClass {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\"._2cZDGA9F7Kx1vfQmWcLP51 {\\\\n color: green;\\\\n}\\\\n\\\\n.otherClassLocalFile {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); // Exports exports.locals = { - \\"className\\": \\"_1iR-jQngOXizCZOLZck-4P\\" + \\"classNameLocalFile\\": \\"_2cZDGA9F7Kx1vfQmWcLP51\\" }; module.exports = exports; " @@ -435,30 +435,29 @@ exports[`"modules" option issue #1063: module 2`] = ` var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\"); exports = ___CSS_LOADER_API_IMPORT___(false); // Module -exports.push([module.id, \\"._2WZy6LhVz_KGVbdNCAmL6C {\\\\n color: green;\\\\n}\\\\n\\\\n._7mafm73rmgiKuViZtzNmn {\\\\n color: blue;\\\\n}\\\\n\\", \\"\\"]); +exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n._2rcag09JpwrP4_hfyyRmm- {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]); // Exports exports.locals = { - \\"className\\": \\"_2WZy6LhVz_KGVbdNCAmL6C\\", - \\"otherClass\\": \\"_7mafm73rmgiKuViZtzNmn\\" + \\"otherClassGlobalFile\\": \\"_2rcag09JpwrP4_hfyyRmm-\\" }; module.exports = exports; " `; exports[`"modules" option issue #1063: result 1`] = ` -"._1iR-jQngOXizCZOLZck-4P { +"._2cZDGA9F7Kx1vfQmWcLP51 { color: green; } -.otherClass { +.otherClassLocalFile { color: blue; } -._2WZy6LhVz_KGVbdNCAmL6C { - color: green; +.classNameGlobalFile { + color: black; } -._7mafm73rmgiKuViZtzNmn { - color: blue; +._2rcag09JpwrP4_hfyyRmm- { + color: coral; } " `; diff --git a/test/fixtures/modules/issue-1063/global.css b/test/fixtures/modules/issue-1063/global.css index 07fafd0b..95eb9774 100644 --- a/test/fixtures/modules/issue-1063/global.css +++ b/test/fixtures/modules/issue-1063/global.css @@ -1,7 +1,7 @@ -.className { - color: green; +.classNameGlobalFile { + color: black; } -:local(.otherClass) { - color: blue; +:local(.otherClassGlobalFile) { + color: coral; } diff --git a/test/fixtures/modules/issue-1063/local.css b/test/fixtures/modules/issue-1063/local.css index e5089557..f68ef05a 100644 --- a/test/fixtures/modules/issue-1063/local.css +++ b/test/fixtures/modules/issue-1063/local.css @@ -1,7 +1,7 @@ -.className { +.classNameLocalFile { color: green; } -:global(.otherClass) { +:global(.otherClassLocalFile) { color: blue; } diff --git a/test/modules-option.test.js b/test/modules-option.test.js index e819a187..b62a7084 100644 --- a/test/modules-option.test.js +++ b/test/modules-option.test.js @@ -570,7 +570,7 @@ describe('"modules" option', () => { const compiler = getCompiler('./modules/issue-1063/issue-1063.js', { modules: { mode: (resourcePath) => { - if (resourcePath === 'global.css') { + if (/global.css$/i.test(resourcePath)) { return 'global'; } From 92b7809a0deab567f581444a6e66afe426a239da Mon Sep 17 00:00:00 2001 From: cap-Bernardito Date: Mon, 6 Apr 2020 14:05:21 +0300 Subject: [PATCH 4/4] feat: modules.mode callback function --- README.md | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 0d9f7fb7..737f15c5 100644 --- a/README.md +++ b/README.md @@ -574,11 +574,9 @@ module.exports = { ###### `Function` -Allows set different values modules.mode based on filename +Allows set different values for the `mode` option based on a filename -Possible return values: - -`local`, `global`, `pure` +Possible return values - `local`, `global` and `pure` **webpack.config.js**