Skip to content

Commit 519e5f4

Browse files
authoredApr 6, 2020
feat: the exportGlobals option for export global classes and ids (#1069)
1 parent 4f158cd commit 519e5f4

15 files changed

+336
-27
lines changed
 

‎README.md

+28
Original file line numberDiff line numberDiff line change
@@ -528,6 +528,7 @@ module.exports = {
528528
options: {
529529
modules: {
530530
mode: 'local',
531+
exportGlobals: true,
531532
localIdentName: '[path][name]__[local]--[hash:base64:5]',
532533
context: path.resolve(__dirname, 'src'),
533534
hashPrefix: 'my-custom-hash',
@@ -605,6 +606,33 @@ module.exports = {
605606
};
606607
```
607608

609+
##### `exportGlobals`
610+
611+
Type: `Boolean`
612+
Default: `false`
613+
614+
Allow `css-loader` to export names from global class or id, so you can use that as local name.
615+
616+
**webpack.config.js**
617+
618+
```js
619+
module.exports = {
620+
module: {
621+
rules: [
622+
{
623+
test: /\.css$/i,
624+
loader: 'css-loader',
625+
options: {
626+
modules: {
627+
exportGlobals: true,
628+
},
629+
},
630+
},
631+
],
632+
},
633+
};
634+
```
635+
608636
##### `localIdentName`
609637

610638
Type: `String`

‎src/options.json

+3
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,9 @@
4646
}
4747
]
4848
},
49+
"exportGlobals": {
50+
"type": "boolean"
51+
},
4952
"localIdentName": {
5053
"type": "string"
5154
},

‎src/utils.js

+3-5
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,7 @@ function getFilter(filter, resourcePath, defaultFilter = null) {
9999
function getModulesPlugins(options, loaderContext) {
100100
let modulesOptions = {
101101
mode: 'local',
102+
exportGlobals: false,
102103
localIdentName: '[hash:base64]',
103104
getLocalIdent,
104105
hashPrefix: '',
@@ -116,11 +117,7 @@ function getModulesPlugins(options, loaderContext) {
116117
}
117118

118119
if (typeof modulesOptions.mode === 'function') {
119-
const modeFromFunction = modulesOptions.mode(loaderContext.resourcePath);
120-
121-
if (modeFromFunction === 'local' || modeFromFunction === 'global') {
122-
modulesOptions.mode = modeFromFunction;
123-
}
120+
modulesOptions.mode = modulesOptions.mode(loaderContext.resourcePath);
124121
}
125122

126123
let plugins = [];
@@ -158,6 +155,7 @@ function getModulesPlugins(options, loaderContext) {
158155

159156
return localIdent;
160157
},
158+
exportGlobals: modulesOptions.exportGlobals,
161159
}),
162160
];
163161
} catch (error) {

‎test/__snapshots__/modules-option.test.js.snap

+152-4
Original file line numberDiff line numberDiff line change
@@ -368,6 +368,8 @@ Array [
368368
"ModuleError: Module Error (from \`replaced original path\`):
369369
options.mode must be either \\"global\\", \\"local\\" or \\"pure\\" (default \\"local\\")",
370370
"ModuleError: Module Error (from \`replaced original path\`):
371+
options.mode must be either \\"global\\", \\"local\\" or \\"pure\\" (default \\"local\\")",
372+
"ModuleError: Module Error (from \`replaced original path\`):
371373
options.mode must be either \\"global\\", \\"local\\" or \\"pure\\" (default \\"local\\")",
372374
]
373375
`;
@@ -409,14 +411,31 @@ exports[`"modules" option issue #1063 throw error: result 1`] = `
409411
:local(.otherClassGlobalFile) {
410412
color: coral;
411413
}
414+
.foo :local(.bar) {
415+
color: red;
416+
}
412417
"
413418
`;
414419
415420
exports[`"modules" option issue #1063 throw error: warnings 1`] = `Array []`;
416421
417422
exports[`"modules" option issue #1063: errors 1`] = `Array []`;
418423
419-
exports[`"modules" option issue #1063: module 1`] = `
424+
exports[`"modules" option issue #1063: module with the \`global\` mode 1`] = `
425+
"// Imports
426+
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
427+
exports = ___CSS_LOADER_API_IMPORT___(false);
428+
// Module
429+
exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n._2rcag09JpwrP4_hfyyRmm- {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]);
430+
// Exports
431+
exports.locals = {
432+
\\"otherClassGlobalFile\\": \\"_2rcag09JpwrP4_hfyyRmm-\\"
433+
};
434+
module.exports = exports;
435+
"
436+
`;
437+
438+
exports[`"modules" option issue #1063: module with the \`local\` mode 1`] = `
420439
"// Imports
421440
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
422441
exports = ___CSS_LOADER_API_IMPORT___(false);
@@ -430,15 +449,16 @@ module.exports = exports;
430449
"
431450
`;
432451
433-
exports[`"modules" option issue #1063: module 2`] = `
452+
exports[`"modules" option issue #1063: module with the \`pure\` mode 1`] = `
434453
"// Imports
435454
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
436455
exports = ___CSS_LOADER_API_IMPORT___(false);
437456
// Module
438-
exports.push([module.id, \\".classNameGlobalFile {\\\\n color: black;\\\\n}\\\\n\\\\n._2rcag09JpwrP4_hfyyRmm- {\\\\n color: coral;\\\\n}\\\\n\\", \\"\\"]);
457+
exports.push([module.id, \\"._1rycxa6QkLdgO7vayuTDvk ._3Otdq1jay-xaQGguOXb-0X {\\\\n color: red;\\\\n}\\\\n\\", \\"\\"]);
439458
// Exports
440459
exports.locals = {
441-
\\"otherClassGlobalFile\\": \\"_2rcag09JpwrP4_hfyyRmm-\\"
460+
\\"foo\\": \\"_1rycxa6QkLdgO7vayuTDvk\\",
461+
\\"bar\\": \\"_3Otdq1jay-xaQGguOXb-0X\\"
442462
};
443463
module.exports = exports;
444464
"
@@ -459,6 +479,9 @@ exports[`"modules" option issue #1063: result 1`] = `
459479
._2rcag09JpwrP4_hfyyRmm- {
460480
color: coral;
461481
}
482+
._1rycxa6QkLdgO7vayuTDvk ._3Otdq1jay-xaQGguOXb-0X {
483+
color: red;
484+
}
462485
"
463486
`;
464487
@@ -11098,3 +11121,128 @@ Array [
1109811121
`;
1109911122
1110011123
exports[`"modules" option should work with the "[local]" placeholder for the "localIdentName" option: warnings 1`] = `Array []`;
11124+
11125+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`global\`): errors 1`] = `Array []`;
11126+
11127+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`global\`): module 1`] = `
11128+
"// Imports
11129+
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
11130+
exports = ___CSS_LOADER_API_IMPORT___(false);
11131+
// Module
11132+
exports.push([module.id, \\".QLhabfC4HjcIBmobkGW_v {\\\\n background-color: red;\\\\n}\\\\n\\\\n._1fCLE6vkQLICB5aEeEaLgd {\\\\n background-color: green;\\\\n}\\\\n\\\\n.baz {\\\\n background-color: blue;\\\\n}\\\\n\\", \\"\\"]);
11133+
// Exports
11134+
exports.locals = {
11135+
\\"foo\\": \\"QLhabfC4HjcIBmobkGW_v\\",
11136+
\\"bar\\": \\"_1fCLE6vkQLICB5aEeEaLgd\\",
11137+
\\"baz\\": \\"baz\\"
11138+
};
11139+
module.exports = exports;
11140+
"
11141+
`;
11142+
11143+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`global\`): result 1`] = `
11144+
Array [
11145+
Array [
11146+
"./modules/exportGlobals-global/exportGlobals.css",
11147+
".QLhabfC4HjcIBmobkGW_v {
11148+
background-color: red;
11149+
}
11150+
11151+
._1fCLE6vkQLICB5aEeEaLgd {
11152+
background-color: green;
11153+
}
11154+
11155+
.baz {
11156+
background-color: blue;
11157+
}
11158+
",
11159+
"",
11160+
],
11161+
]
11162+
`;
11163+
11164+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`global\`): warnings 1`] = `Array []`;
11165+
11166+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`local\`): errors 1`] = `Array []`;
11167+
11168+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`local\`): module 1`] = `
11169+
"// Imports
11170+
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
11171+
exports = ___CSS_LOADER_API_IMPORT___(false);
11172+
// Module
11173+
exports.push([module.id, \\".foo {\\\\n background-color: red;\\\\n}\\\\n\\\\n._3loyPgwYlZ-RBGWccx71es {\\\\n background-color: green;\\\\n}\\\\n\\\\n.baz {\\\\n background-color: blue;\\\\n}\\\\n\\", \\"\\"]);
11174+
// Exports
11175+
exports.locals = {
11176+
\\"foo\\": \\"foo\\",
11177+
\\"bar\\": \\"_3loyPgwYlZ-RBGWccx71es\\",
11178+
\\"baz\\": \\"baz\\"
11179+
};
11180+
module.exports = exports;
11181+
"
11182+
`;
11183+
11184+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`local\`): result 1`] = `
11185+
Array [
11186+
Array [
11187+
"./modules/exportGlobals-local/exportGlobals.css",
11188+
".foo {
11189+
background-color: red;
11190+
}
11191+
11192+
._3loyPgwYlZ-RBGWccx71es {
11193+
background-color: green;
11194+
}
11195+
11196+
.baz {
11197+
background-color: blue;
11198+
}
11199+
",
11200+
"",
11201+
],
11202+
]
11203+
`;
11204+
11205+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`local\`): warnings 1`] = `Array []`;
11206+
11207+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`pure\`): errors 1`] = `Array []`;
11208+
11209+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`pure\`): module 1`] = `
11210+
"// Imports
11211+
var ___CSS_LOADER_API_IMPORT___ = require(\\"../../../../src/runtime/api.js\\");
11212+
exports = ___CSS_LOADER_API_IMPORT___(false);
11213+
// Module
11214+
exports.push([module.id, \\"._3OALfsKrVzw8QnGzfteWls {\\\\n background-color: red;\\\\n}\\\\n\\\\n._3w1OTKuiiZvf8WY1tCPaZH ._1cmRmgT7HI056zoTdHDOVh {\\\\n background-color: green;\\\\n}\\\\n\\\\n._3pB9KhpUqVA1pPH1Y8ei3y .baz {\\\\n background-color: blue;\\\\n}\\\\n\\", \\"\\"]);
11215+
// Exports
11216+
exports.locals = {
11217+
\\"foo\\": \\"_3OALfsKrVzw8QnGzfteWls\\",
11218+
\\"one\\": \\"_3w1OTKuiiZvf8WY1tCPaZH\\",
11219+
\\"bar\\": \\"_1cmRmgT7HI056zoTdHDOVh\\",
11220+
\\"two\\": \\"_3pB9KhpUqVA1pPH1Y8ei3y\\",
11221+
\\"baz\\": \\"baz\\"
11222+
};
11223+
module.exports = exports;
11224+
"
11225+
`;
11226+
11227+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`pure\`): result 1`] = `
11228+
Array [
11229+
Array [
11230+
"./modules/exportGlobals-pure/exportGlobals.css",
11231+
"._3OALfsKrVzw8QnGzfteWls {
11232+
background-color: red;
11233+
}
11234+
11235+
._3w1OTKuiiZvf8WY1tCPaZH ._1cmRmgT7HI056zoTdHDOVh {
11236+
background-color: green;
11237+
}
11238+
11239+
._3pB9KhpUqVA1pPH1Y8ei3y .baz {
11240+
background-color: blue;
11241+
}
11242+
",
11243+
"",
11244+
],
11245+
]
11246+
`;
11247+
11248+
exports[`"modules" option should work with the \`exportGlobals\` option (the \`mode\` option is \`pure\`): warnings 1`] = `Array []`;

‎test/__snapshots__/validate-options.test.js.snap

+19-14
Original file line numberDiff line numberDiff line change
@@ -48,10 +48,15 @@ exports[`validate options should throw an error on the "modules" option with "{"
4848
- options.modules.context should be a string."
4949
`;
5050

51+
exports[`validate options should throw an error on the "modules" option with "{"exportGlobals":"invalid"}" value 1`] = `
52+
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
53+
- options.modules.exportGlobals should be a boolean."
54+
`;
55+
5156
exports[`validate options should throw an error on the "modules" option with "{"getLocalIdent":[]}" value 1`] = `
5257
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
5358
- options.modules should be one of these:
54-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
59+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
5560
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
5661
Details:
5762
* options.modules.getLocalIdent should be one of these:
@@ -74,7 +79,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
7479
exports[`validate options should throw an error on the "modules" option with "{"localIdentRegExp":true}" value 1`] = `
7580
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
7681
- options.modules should be one of these:
77-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
82+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
7883
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
7984
Details:
8085
* options.modules.localIdentRegExp should be one of these:
@@ -87,7 +92,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
8792
exports[`validate options should throw an error on the "modules" option with "{"mode":"globals"}" value 1`] = `
8893
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
8994
- options.modules should be one of these:
90-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
95+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
9196
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
9297
Details:
9398
* options.modules.mode should be one of these:
@@ -101,7 +106,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
101106
exports[`validate options should throw an error on the "modules" option with "{"mode":"locals"}" value 1`] = `
102107
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
103108
- options.modules should be one of these:
104-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
109+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
105110
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
106111
Details:
107112
* options.modules.mode should be one of these:
@@ -115,7 +120,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
115120
exports[`validate options should throw an error on the "modules" option with "{"mode":"pures"}" value 1`] = `
116121
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
117122
- options.modules should be one of these:
118-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
123+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
119124
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
120125
Details:
121126
* options.modules.mode should be one of these:
@@ -129,7 +134,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
129134
exports[`validate options should throw an error on the "modules" option with "{"mode":true}" value 1`] = `
130135
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
131136
- options.modules should be one of these:
132-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
137+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
133138
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
134139
Details:
135140
* options.modules.mode should be one of these:
@@ -143,53 +148,53 @@ exports[`validate options should throw an error on the "modules" option with "{"
143148
exports[`validate options should throw an error on the "modules" option with "globals" value 1`] = `
144149
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
145150
- options.modules should be one of these:
146-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
151+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
147152
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
148153
Details:
149154
* options.modules should be a boolean.
150155
* options.modules should be one of these:
151156
\\"local\\" | \\"global\\" | \\"pure\\"
152157
* options.modules should be an object:
153-
object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
158+
object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
154159
`;
155160
156161
exports[`validate options should throw an error on the "modules" option with "locals" value 1`] = `
157162
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
158163
- options.modules should be one of these:
159-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
164+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
160165
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
161166
Details:
162167
* options.modules should be a boolean.
163168
* options.modules should be one of these:
164169
\\"local\\" | \\"global\\" | \\"pure\\"
165170
* options.modules should be an object:
166-
object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
171+
object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
167172
`;
168173
169174
exports[`validate options should throw an error on the "modules" option with "pures" value 1`] = `
170175
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
171176
- options.modules should be one of these:
172-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
177+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
173178
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
174179
Details:
175180
* options.modules should be a boolean.
176181
* options.modules should be one of these:
177182
\\"local\\" | \\"global\\" | \\"pure\\"
178183
* options.modules should be an object:
179-
object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
184+
object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
180185
`;
181186
182187
exports[`validate options should throw an error on the "modules" option with "true" value 1`] = `
183188
"Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
184189
- options.modules should be one of these:
185-
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
190+
boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }
186191
-> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
187192
Details:
188193
* options.modules should be a boolean.
189194
* options.modules should be one of these:
190195
\\"local\\" | \\"global\\" | \\"pure\\"
191196
* options.modules should be an object:
192-
object { mode?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
197+
object { mode?, exportGlobals?, localIdentName?, localIdentRegExp?, context?, hashPrefix?, getLocalIdent? }"
193198
`;
194199
195200
exports[`validate options should throw an error on the "onlyLocals" option with "true" value 1`] = `
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
.foo {
2+
background-color: red;
3+
}
4+
5+
:local(.bar) {
6+
background-color: green;
7+
}
8+
9+
:global(.baz) {
10+
background-color: blue;
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import css from './exportGlobals.css';
2+
3+
__export__ = css;
4+
5+
export default css;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
.foo {
2+
background-color: red;
3+
}
4+
5+
:local(.bar) {
6+
background-color: green;
7+
}
8+
9+
:global(.baz) {
10+
background-color: blue;
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import css from './exportGlobals.css';
2+
3+
__export__ = css;
4+
5+
export default css;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
.foo {
2+
background-color: red;
3+
}
4+
5+
.one :local(.bar) {
6+
background-color: green;
7+
}
8+
9+
.two :global(.baz) {
10+
background-color: blue;
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import css from './exportGlobals.css';
2+
3+
__export__ = css;
4+
5+
export default css;
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import css1 from './local.css';
22
import css2 from './global.css';
3+
import css3 from './pure.css';
34

4-
__export__ = css1 + css2;
5+
__export__ = css1 + css2 + css3;
56

6-
export default css1 + css2;
7+
export default css1 + css2 + css3;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.foo :local(.bar) {
2+
color: red;
3+
}

‎test/modules-option.test.js

+75-2
Original file line numberDiff line numberDiff line change
@@ -570,6 +570,10 @@ describe('"modules" option', () => {
570570
const compiler = getCompiler('./modules/issue-1063/issue-1063.js', {
571571
modules: {
572572
mode: (resourcePath) => {
573+
if (/pure.css$/i.test(resourcePath)) {
574+
return 'pure';
575+
}
576+
573577
if (/global.css$/i.test(resourcePath)) {
574578
return 'global';
575579
}
@@ -582,10 +586,13 @@ describe('"modules" option', () => {
582586

583587
expect(
584588
getModuleSource('./modules/issue-1063/local.css', stats)
585-
).toMatchSnapshot('module');
589+
).toMatchSnapshot('module with the `local` mode');
586590
expect(
587591
getModuleSource('./modules/issue-1063/global.css', stats)
588-
).toMatchSnapshot('module');
592+
).toMatchSnapshot('module with the `global` mode');
593+
expect(
594+
getModuleSource('./modules/issue-1063/pure.css', stats)
595+
).toMatchSnapshot('module with the `pure` mode');
589596
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
590597
'result'
591598
);
@@ -615,4 +622,70 @@ describe('"modules" option', () => {
615622
expect(getWarnings(stats)).toMatchSnapshot('warnings');
616623
expect(getErrors(stats)).toMatchSnapshot('errors');
617624
});
625+
626+
it('should work with the `exportGlobals` option (the `mode` option is `global`)', async () => {
627+
const compiler = getCompiler(
628+
'./modules/exportGlobals-global/exportGlobals.js',
629+
{
630+
modules: {
631+
mode: 'local',
632+
exportGlobals: true,
633+
},
634+
}
635+
);
636+
const stats = await compile(compiler);
637+
638+
expect(
639+
getModuleSource('./modules/exportGlobals-global/exportGlobals.css', stats)
640+
).toMatchSnapshot('module');
641+
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
642+
'result'
643+
);
644+
expect(getWarnings(stats)).toMatchSnapshot('warnings');
645+
expect(getErrors(stats)).toMatchSnapshot('errors');
646+
});
647+
648+
it('should work with the `exportGlobals` option (the `mode` option is `local`)', async () => {
649+
const compiler = getCompiler(
650+
'./modules/exportGlobals-local/exportGlobals.js',
651+
{
652+
modules: {
653+
mode: 'global',
654+
exportGlobals: true,
655+
},
656+
}
657+
);
658+
const stats = await compile(compiler);
659+
660+
expect(
661+
getModuleSource('./modules/exportGlobals-local/exportGlobals.css', stats)
662+
).toMatchSnapshot('module');
663+
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
664+
'result'
665+
);
666+
expect(getWarnings(stats)).toMatchSnapshot('warnings');
667+
expect(getErrors(stats)).toMatchSnapshot('errors');
668+
});
669+
670+
it('should work with the `exportGlobals` option (the `mode` option is `pure`)', async () => {
671+
const compiler = getCompiler(
672+
'./modules/exportGlobals-pure/exportGlobals.js',
673+
{
674+
modules: {
675+
mode: 'pure',
676+
exportGlobals: true,
677+
},
678+
}
679+
);
680+
const stats = await compile(compiler);
681+
682+
expect(
683+
getModuleSource('./modules/exportGlobals-pure/exportGlobals.css', stats)
684+
).toMatchSnapshot('module');
685+
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
686+
'result'
687+
);
688+
expect(getWarnings(stats)).toMatchSnapshot('warnings');
689+
expect(getErrors(stats)).toMatchSnapshot('errors');
690+
});
618691
});

‎test/validate-options.test.js

+2
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ describe('validate options', () => {
2727
{ getLocalIdent: () => {} },
2828
{ localIdentRegExp: 'page-(.*)\\.js' },
2929
{ localIdentRegExp: /page-(.*)\.js/ },
30+
{ exportGlobals: true },
3031
],
3132
failure: [
3233
'true',
@@ -42,6 +43,7 @@ describe('validate options', () => {
4243
{ hashPrefix: true },
4344
{ getLocalIdent: [] },
4445
{ localIdentRegExp: true },
46+
{ exportGlobals: 'invalid' },
4547
],
4648
},
4749
sourceMap: {

0 commit comments

Comments
 (0)
Please sign in to comment.