diff --git a/README.md b/README.md index ceedfd4e..a73c8035 100644 --- a/README.md +++ b/README.md @@ -577,7 +577,6 @@ module.exports = { loader: "css-loader", options: { modules: { - compileType: "module", mode: "local", auto: true, exportGlobals: true, @@ -595,38 +594,6 @@ module.exports = { }; ``` -##### `compileType` - -Type: `'module' | 'icss'` -Default: `'module'` - -Controls the level of compilation applied to the input styles. - -The `module` handles `class` and `id` scoping and `@value` values. -The `icss` will only compile the low level `Interoperable CSS` format for declaring `:import` and `:export` dependencies between CSS and other languages. - -ICSS underpins CSS Module support, and provides a low level syntax for other tools to implement CSS-module variations of their own. - -**webpack.config.js** - -```js -module.exports = { - module: { - rules: [ - { - test: /\.css$/i, - loader: "css-loader", - options: { - modules: { - compileType: "icss", - }, - }, - }, - ], - }, -}; -``` - ##### `auto` Type: `Boolean|RegExp|Function` @@ -638,7 +605,7 @@ Allows auto enable CSS modules based on filename. Possible values: -- `true` - enables CSS modules or interoperable CSS format, sets the [`modules.compileType`](#compiletype) option to `module` value for all files which satisfy `/\.module(s)?\.\w+$/i.test(filename)` condition or sets the [`modules.compileType`](#compiletype) option to `icss` value for all files which satisfy `/\.icss\.\w+$/i.test(filename)` condition +- `true` - enables CSS modules or interoperable CSS format, sets the [`modules.mode`](#mode) option to `local` value for all files which satisfy `/\.module(s)?\.\w+$/i.test(filename)` condition or sets the [`modules.mode`](#mode) option to `icss` value for all files which satisfy `/\.icss\.\w+$/i.test(filename)` condition - `false` - disables CSS modules or interoperable CSS format based on filename **webpack.config.js** @@ -716,9 +683,16 @@ Default: `'local'` Setup `mode` option. You can omit the value when you want `local` mode. +Controls the level of compilation applied to the input styles. + +The `local`, `global`, and `pure` handles `class` and `id` scoping and `@value` values. +The `icss` will only compile the low level `Interoperable CSS` format for declaring `:import` and `:export` dependencies between CSS and other languages. + +ICSS underpins CSS Module support, and provides a low level syntax for other tools to implement CSS-module variations of their own. + ###### `String` -Possible values - `local`, `global`, and `pure`. +Possible values - `local`, `global`, `pure`, and `icss`. **webpack.config.js** @@ -744,7 +718,7 @@ module.exports = { Allows set different values for the `mode` option based on a filename -Possible return values - `local`, `global`, and `pure`. +Possible return values - `local`, `global`, `pure` and `icss`. **webpack.config.js** @@ -1312,7 +1286,7 @@ module.exports = { ### Separating `Interoperable CSS`-only and `CSS Module` features -The following setup is an example of allowing `Interoperable CSS` features only (such as `:import` and `:export`) without using further `CSS Module` functionality by setting `compileType` option for all files that do not match `*.module.scss` naming convention. This is for reference as having `ICSS` features applied to all files was default `css-loader` behavior before v4. +The following setup is an example of allowing `Interoperable CSS` features only (such as `:import` and `:export`) without using further `CSS Module` functionality by setting `mode` option for all files that do not match `*.module.scss` naming convention. This is for reference as having `ICSS` features applied to all files was default `css-loader` behavior before v4. Meanwhile all files matching `*.module.scss` are treated as `CSS Modules` in this example. An example case is assumed where a project requires canvas drawing variables to be synchronized with CSS - canvas drawing uses the same color (set by color name in JavaScript) as HTML background (set by class name in CSS). @@ -1338,7 +1312,7 @@ module.exports = { options: { importLoaders: 1, modules: { - compileType: 'icss' + mode: 'icss' } } }, @@ -1360,7 +1334,7 @@ module.exports = { options: { importLoaders: 1, modules: { - compileType: 'module' + mode: 'local' } } }, diff --git a/src/options.json b/src/options.json index f123d723..bca0f695 100644 --- a/src/options.json +++ b/src/options.json @@ -57,16 +57,12 @@ "type": "boolean" }, { - "enum": ["local", "global", "pure"] + "enum": ["local", "global", "pure", "icss"] }, { "type": "object", "additionalProperties": false, "properties": { - "compileType": { - "description": "Controls the extent to which css-loader will process module code (https://github.com/webpack-contrib/css-loader#type)", - "enum": ["module", "icss"] - }, "auto": { "description": "Allows auto enable CSS modules based on filename (https://github.com/webpack-contrib/css-loader#auto).", "anyOf": [ @@ -85,7 +81,7 @@ "description": "Setup `mode` option (https://github.com/webpack-contrib/css-loader#mode).", "anyOf": [ { - "enum": ["local", "global", "pure"] + "enum": ["local", "global", "pure", "icss"] }, { "instanceof": "Function" diff --git a/src/utils.js b/src/utils.js index f09275d7..fe271696 100644 --- a/src/utils.js +++ b/src/utils.js @@ -358,9 +358,8 @@ function getModulesOptions(rawOptions, loaderContext) { } let modulesOptions = { - compileType: isIcss ? "icss" : "module", auto: true, - mode: "local", + mode: isIcss ? "icss" : "local", exportGlobals: false, localIdentName: "[hash:base64]", localIdentContext: loaderContext.rootContext, @@ -485,7 +484,11 @@ function shouldUseURLPlugin(options) { } function shouldUseModulesPlugins(options) { - return options.modules.compileType === "module"; + if (typeof options.modules === "boolean" && options.modules === false) { + return false; + } + + return options.modules.mode !== "icss"; } function shouldUseIcssPlugin(options) { diff --git a/test/__snapshots__/modules-option.test.js.snap b/test/__snapshots__/modules-option.test.js.snap index 775b5fb3..9416ce66 100644 --- a/test/__snapshots__/modules-option.test.js.snap +++ b/test/__snapshots__/modules-option.test.js.snap @@ -13048,43 +13048,506 @@ Array [ exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`pure\`): warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" and "exportOnlyLocals" options: errors 1`] = `Array []`; +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" and "exportOnlyLocals" options: module 1`] = ` +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export": module 1`] = ` "// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_right_value\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/duplicate-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export-in-multiple-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export-in-multiple-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_right_value\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export-in-multiple-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/duplicate-export-in-multiple-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "duplicate-export-in-multiple-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/empty-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-import": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-import": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-import": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/empty-import/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "empty-import": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export-reserved-keywords": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export-reserved-keywords": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"constructor\\": \\"constructor\\", + \\"toString\\": \\"toString\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export-reserved-keywords": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/export-reserved-keywords/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "export-reserved-keywords": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\"\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import": result 1`] = ` +Array [ + Array [ + "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import/vars.css", + " +", + "", + ], + Array [ + "./modules/icss/tests-cases/import/source.css", + ".className { + color: red; +} +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import-reserved-keywords": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import-reserved-keywords": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\";\\\\n display: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"secondary-color\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\"\\", + \\"secondary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"secondary-color\\"] + \\"\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import-reserved-keywords": result 1`] = ` +Array [ + Array [ + "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import-reserved-keywords/vars.css", + " +", + "", + ], + Array [ + "./modules/icss/tests-cases/import-reserved-keywords/source.css", + ".className { + color: red; + display: block; +} +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "import-reserved-keywords": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\", + \\"_foo\\": \\"_bar\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/multiple-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-keys-values-in-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-keys-values-in-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\", + \\"_test1\\": \\"1\\", + \\"_test2\\": \\"'string'\\", + \\"_test3\\": \\"1px 2px 3px\\", + \\"_test4\\": \\"1px 2px 3px, 1px 2px 3px\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-keys-values-in-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/multiple-keys-values-in-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "mode" option is function and return "icss" value, case "multiple-keys-values-in-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_right_value\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/duplicate-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export-in-multiple-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export-in-multiple-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_right_value\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export-in-multiple-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/duplicate-export-in-multiple-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "duplicate-export-in-multiple-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); // Exports -export default { - \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___[\\"primary-color\\"] + \\"\\" +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/empty-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-import": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-import": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-import": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/empty-import/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "empty-import": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\" }; +export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" and "exportOnlyLocals" options: result 1`] = ` -Object { - "primary-color": "red", -} +exports[`"modules" option show work when the "modules" option is "icss", case "export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/export/source.css", + " +", + "", + ], +] `; -exports[`"modules" option show work with the "compileType" and "exportOnlyLocals" options: warnings 1`] = `Array []`; +exports[`"modules" option show work when the "modules" option is "icss", case "export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" and "namedExport" options: errors 1`] = `Array []`; +exports[`"modules" option show work when the "modules" option is "icss", case "export-reserved-keywords": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" and "namedExport" options: module 1`] = ` +exports[`"modules" option show work when the "modules" option is "icss", case "export-reserved-keywords": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; -import ___CSS_LOADER_ICSS_IMPORT_0___, * as ___CSS_LOADER_ICSS_IMPORT_0____NAMED___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"constructor\\": \\"constructor\\", + \\"toString\\": \\"toString\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "export-reserved-keywords": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/export-reserved-keywords/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "export-reserved-keywords": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); ___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true); // Module -___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0____NAMED___[\\"primaryColor\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); +___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); // Exports -export const primaryColor = \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0____NAMED___[\\"primaryColor\\"] + \\"\\"; +___CSS_LOADER_EXPORT___.locals = { + \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\"\\" +}; export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" and "namedExport" options: result 1`] = ` +exports[`"modules" option show work when the "modules" option is "icss", case "import": result 1`] = ` Array [ Array [ "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import/vars.css", @@ -13103,11 +13566,115 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" and "namedExport" options: warnings 1`] = `Array []`; +exports[`"modules" option show work when the "modules" option is "icss", case "import": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import-reserved-keywords": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import-reserved-keywords": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\";\\\\n display: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"secondary-color\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\"\\", + \\"secondary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"secondary-color\\"] + \\"\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import-reserved-keywords": result 1`] = ` +Array [ + Array [ + "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import-reserved-keywords/vars.css", + " +", + "", + ], + Array [ + "./modules/icss/tests-cases/import-reserved-keywords/source.css", + ".className { + color: red; + display: block; +} +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "import-reserved-keywords": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\", + \\"_foo\\": \\"_bar\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/multiple-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-export": warnings 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-keys-values-in-export": errors 1`] = `Array []`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-keys-values-in-export": module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\"\\\\n\\", \\"\\"]); +// Exports +___CSS_LOADER_EXPORT___.locals = { + \\"_test\\": \\"_test\\", + \\"_test1\\": \\"1\\", + \\"_test2\\": \\"'string'\\", + \\"_test3\\": \\"1px 2px 3px\\", + \\"_test4\\": \\"1px 2px 3px, 1px 2px 3px\\" +}; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-keys-values-in-export": result 1`] = ` +Array [ + Array [ + "./modules/icss/tests-cases/multiple-keys-values-in-export/source.css", + " +", + "", + ], +] +`; + +exports[`"modules" option show work when the "modules" option is "icss", case "multiple-keys-values-in-export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option using the "module" value: errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode" option using the "local" value: errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option using the "module" value: module 1`] = ` +exports[`"modules" option show work with the "mode" option using the "local" value: module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../src/runtime/api.js\\"; import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../src/index.js??ruleSet[1].rules[0].use[0]!./values.css\\"; @@ -13188,7 +13755,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option using the "module" value: result 1`] = ` +exports[`"modules" option show work with the "mode" option using the "local" value: result 1`] = ` Array [ Array [ "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/composes/test-other.css", @@ -13384,11 +13951,68 @@ a { ] `; -exports[`"modules" option show work with the "compileType" option using the "module" value: warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode" option using the "local" value: warnings 1`] = `Array []`; + +exports[`"modules" option show work with the "mode: icss" and "exportOnlyLocals" options: errors 1`] = `Array []`; + +exports[`"modules" option show work with the "mode: icss" and "exportOnlyLocals" options: module 1`] = ` +"// Imports +import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +// Exports +export default { + \\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___[\\"primary-color\\"] + \\"\\" +}; +" +`; + +exports[`"modules" option show work with the "mode: icss" and "exportOnlyLocals" options: result 1`] = ` +Object { + "primary-color": "red", +} +`; + +exports[`"modules" option show work with the "mode: icss" and "exportOnlyLocals" options: warnings 1`] = `Array []`; + +exports[`"modules" option show work with the "mode: icss" and "namedExport" options: errors 1`] = `Array []`; + +exports[`"modules" option show work with the "mode: icss" and "namedExport" options: module 1`] = ` +"// Imports +import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; +import ___CSS_LOADER_ICSS_IMPORT_0___, * as ___CSS_LOADER_ICSS_IMPORT_0____NAMED___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; +var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); +___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true); +// Module +___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0____NAMED___[\\"primaryColor\\"] + \\";\\\\n}\\\\n\\", \\"\\"]); +// Exports +export const primaryColor = \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0____NAMED___[\\"primaryColor\\"] + \\"\\"; +export default ___CSS_LOADER_EXPORT___; +" +`; + +exports[`"modules" option show work with the "mode: icss" and "namedExport" options: result 1`] = ` +Array [ + Array [ + "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import/vars.css", + " +", + "", + ], + Array [ + "./modules/icss/tests-cases/import/source.css", + ".className { + color: red; +} +", + "", + ], +] +`; + +exports[`"modules" option show work with the "mode: icss" and "namedExport" options: warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13402,7 +14026,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/duplicate-export/source.css", @@ -13413,11 +14037,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export-in-multiple-export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export-in-multiple-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export-in-multiple-export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export-in-multiple-export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13431,7 +14055,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export-in-multiple-export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export-in-multiple-export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/duplicate-export-in-multiple-export/source.css", @@ -13442,11 +14066,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "duplicate-export-in-multiple-export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "duplicate-export-in-multiple-export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "empty-export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "empty-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "empty-export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "empty-export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13457,7 +14081,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "empty-export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "empty-export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/empty-export/source.css", @@ -13468,11 +14092,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "empty-export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "empty-export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "empty-import": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "empty-import": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "empty-import": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "empty-import": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13483,7 +14107,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "empty-import": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "empty-import": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/empty-import/source.css", @@ -13494,11 +14118,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "empty-import": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "empty-import": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13512,7 +14136,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/export/source.css", @@ -13523,11 +14147,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "export-reserved-keywords": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "export-reserved-keywords": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "export-reserved-keywords": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "export-reserved-keywords": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13542,7 +14166,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "export-reserved-keywords": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "export-reserved-keywords": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/export-reserved-keywords/source.css", @@ -13553,11 +14177,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "export-reserved-keywords": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "export-reserved-keywords": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "import": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "import": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "import": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "import": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; @@ -13573,7 +14197,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "import": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "import": result 1`] = ` Array [ Array [ "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import/vars.css", @@ -13592,11 +14216,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "import": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "import": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "import-reserved-keywords": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "import-reserved-keywords": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "import-reserved-keywords": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "import-reserved-keywords": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../../src/index.js??ruleSet[1].rules[0].use[0]!./vars.css\\"; @@ -13613,7 +14237,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "import-reserved-keywords": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "import-reserved-keywords": result 1`] = ` Array [ Array [ "../../src/index.js??ruleSet[1].rules[0].use[0]!./modules/icss/tests-cases/import-reserved-keywords/vars.css", @@ -13633,11 +14257,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "import-reserved-keywords": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "import-reserved-keywords": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "multiple-export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "multiple-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "multiple-export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "multiple-export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13652,7 +14276,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "multiple-export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "multiple-export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/multiple-export/source.css", @@ -13663,11 +14287,11 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "multiple-export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "multiple-export": warnings 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "multiple-keys-values-in-export": errors 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "multiple-keys-values-in-export": errors 1`] = `Array []`; -exports[`"modules" option show work with the "compileType" option, case "multiple-keys-values-in-export": module 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "multiple-keys-values-in-export": module 1`] = ` "// Imports import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../../src/runtime/api.js\\"; var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1]}); @@ -13685,7 +14309,7 @@ export default ___CSS_LOADER_EXPORT___; " `; -exports[`"modules" option show work with the "compileType" option, case "multiple-keys-values-in-export": result 1`] = ` +exports[`"modules" option show work with the "mode: icss" option, case "multiple-keys-values-in-export": result 1`] = ` Array [ Array [ "./modules/icss/tests-cases/multiple-keys-values-in-export/source.css", @@ -13696,4 +14320,4 @@ Array [ ] `; -exports[`"modules" option show work with the "compileType" option, case "multiple-keys-values-in-export": warnings 1`] = `Array []`; +exports[`"modules" option show work with the "mode: icss" option, case "multiple-keys-values-in-export": warnings 1`] = `Array []`; diff --git a/test/__snapshots__/validate-options.test.js.snap b/test/__snapshots__/validate-options.test.js.snap index 1a5d9a19..90d0db65 100644 --- a/test/__snapshots__/validate-options.test.js.snap +++ b/test/__snapshots__/validate-options.test.js.snap @@ -68,7 +68,7 @@ exports[`validate options should throw an error on the "import" option with "tru exports[`validate options should throw an error on the "modules" option with "{"auto":"invalid"}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules.auto should be one of these: @@ -80,13 +80,6 @@ exports[`validate options should throw an error on the "modules" option with "{" * options.modules.auto should be a boolean." `; -exports[`validate options should throw an error on the "modules" option with "{"compileType":"unknown"}" value 1`] = ` -"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - - options.modules.compileType should be one of these: - \\"module\\" | \\"icss\\" - -> Controls the extent to which css-loader will process module code (https://github.com/webpack-contrib/css-loader#type)" -`; - exports[`validate options should throw an error on the "modules" option with "{"exportGlobals":"invalid"}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules.exportGlobals should be a boolean. @@ -133,7 +126,7 @@ exports[`validate options should throw an error on the "modules" option with "{" exports[`validate options should throw an error on the "modules" option with "{"localIdentRegExp":true}" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules.localIdentRegExp should be one of these: @@ -147,60 +140,60 @@ 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 should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> 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 + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | function -> Setup \`mode\` option (https://github.com/webpack-contrib/css-loader#mode). Details: * options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * 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 should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> 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 + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | function -> Setup \`mode\` option (https://github.com/webpack-contrib/css-loader#mode). Details: * options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * 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 should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> 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 + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | function -> Setup \`mode\` option (https://github.com/webpack-contrib/css-loader#mode). Details: * options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * 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 should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> 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 + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | function -> Setup \`mode\` option (https://github.com/webpack-contrib/css-loader#mode). Details: * options.modules.mode should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * options.modules.mode should be an instance of function." `; @@ -213,53 +206,53 @@ exports[`validate options should throw an error on the "modules" option with "{" exports[`validate options should throw an error on the "modules" option with "globals" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules should be a boolean. * options.modules should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * options.modules should be an object: - object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" + object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" `; exports[`validate options should throw an error on the "modules" option with "locals" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules should be a boolean. * options.modules should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * options.modules should be an object: - object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" + object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" `; exports[`validate options should throw an error on the "modules" option with "pures" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules should be a boolean. * options.modules should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * options.modules should be an object: - object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" + object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" `; exports[`validate options should throw an error on the "modules" option with "true" value 1`] = ` "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema. - options.modules should be one of these: - boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } + boolean | \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" | object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? } -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules). Details: * options.modules should be a boolean. * options.modules should be one of these: - \\"local\\" | \\"global\\" | \\"pure\\" + \\"local\\" | \\"global\\" | \\"pure\\" | \\"icss\\" * options.modules should be an object: - object { compileType?, auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" + object { auto?, mode?, localIdentName?, localIdentContext?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, namedExport?, exportGlobals?, exportLocalsConvention?, exportOnlyLocals? }" `; exports[`validate options should throw an error on the "sourceMap" option with "true" value 1`] = ` diff --git a/test/modules-option.test.js b/test/modules-option.test.js index 4e04bf9e..539be6c7 100644 --- a/test/modules-option.test.js +++ b/test/modules-option.test.js @@ -1410,12 +1410,52 @@ describe('"modules" option', () => { const icssTestCases = fs.readdirSync(icssTestCasesPath); icssTestCases.forEach((name) => { - it(`show work with the "compileType" option, case "${name}"`, async () => { + it(`show work when the "modules" option is "icss", case "${name}"`, async () => { + const compiler = getCompiler( + `./modules/icss/tests-cases/${name}/source.js`, + { + modules: "icss", + } + ); + const stats = await compile(compiler); + + expect( + getModuleSource(`./modules/icss/tests-cases/${name}/source.css`, stats) + ).toMatchSnapshot("module"); + expect( + getExecutedCode("main.bundle.js", compiler, stats) + ).toMatchSnapshot("result"); + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); + + it(`show work with the "mode: icss" option, case "${name}"`, async () => { const compiler = getCompiler( `./modules/icss/tests-cases/${name}/source.js`, { modules: { - compileType: "icss", + mode: "icss", + }, + } + ); + const stats = await compile(compiler); + + expect( + getModuleSource(`./modules/icss/tests-cases/${name}/source.css`, stats) + ).toMatchSnapshot("module"); + expect( + getExecutedCode("main.bundle.js", compiler, stats) + ).toMatchSnapshot("result"); + expect(getWarnings(stats)).toMatchSnapshot("warnings"); + expect(getErrors(stats)).toMatchSnapshot("errors"); + }); + + it(`show work when the "mode" option is function and return "icss" value, case "${name}"`, async () => { + const compiler = getCompiler( + `./modules/icss/tests-cases/${name}/source.js`, + { + modules: { + mode: () => "icss", }, } ); @@ -1432,12 +1472,12 @@ describe('"modules" option', () => { }); }); - it('show work with the "compileType" and "exportOnlyLocals" options', async () => { + it('show work with the "mode: icss" and "exportOnlyLocals" options', async () => { const compiler = getCompiler( "./modules/icss/tests-cases/import/source.js", { modules: { - compileType: "icss", + mode: "icss", exportOnlyLocals: true, }, } @@ -1454,12 +1494,12 @@ describe('"modules" option', () => { expect(getErrors(stats)).toMatchSnapshot("errors"); }); - it('show work with the "compileType" and "namedExport" options', async () => { + it('show work with the "mode: icss" and "namedExport" options', async () => { const compiler = getCompiler( "./modules/icss/tests-cases/import/source.js", { modules: { - compileType: "icss", + mode: "icss", namedExport: true, }, } @@ -1476,10 +1516,10 @@ describe('"modules" option', () => { expect(getErrors(stats)).toMatchSnapshot("errors"); }); - it('show work with the "compileType" option using the "module" value', async () => { + it('show work with the "mode" option using the "local" value', async () => { const compiler = getCompiler("./modules/composes/composes.js", { modules: { - compileType: "module", + mode: "local", }, }); const stats = await compile(compiler); diff --git a/test/validate-options.test.js b/test/validate-options.test.js index 92403a4e..401af453 100644 --- a/test/validate-options.test.js +++ b/test/validate-options.test.js @@ -32,11 +32,11 @@ describe("validate options", () => { "global", "local", "pure", - { compileType: "module" }, - { compileType: "icss" }, + "icss", { mode: "global" }, { mode: "local" }, { mode: "pure" }, + { mode: "icss" }, { mode: () => "local" }, { localIdentName: "[path][name]__[local]--[hash:base64:5]" }, { localIdentContext: "context" }, @@ -67,7 +67,6 @@ describe("validate options", () => { "globals", "locals", "pures", - { compileType: "unknown" }, { mode: true }, { mode: "globals" }, { mode: "locals" },