Skip to content

Commit 2f1573f

Browse files
feat: auto enable icss modules
BREAKING CHANGE: Auto enable icss modules for all files for which /\.icss\.\w+$/i.test(filename)
1 parent df111b8 commit 2f1573f

File tree

8 files changed

+133
-10
lines changed

8 files changed

+133
-10
lines changed

src/utils.js

+8-10
Original file line numberDiff line numberDiff line change
@@ -109,15 +109,21 @@ function getFilter(filter, resourcePath) {
109109
};
110110
}
111111

112-
const moduleRegExp = /\.module\.\w+$/i;
112+
const moduleRegExp = /\.module(s)?\.\w+$/i;
113+
const icssRegExp = /\.icss\.\w+$/i;
113114

114115
function getModulesOptions(rawOptions, loaderContext) {
115116
const { resourcePath } = loaderContext;
117+
let isIcss;
116118

117119
if (typeof rawOptions.modules === 'undefined') {
118120
const isModules = moduleRegExp.test(resourcePath);
119121

120122
if (!isModules) {
123+
isIcss = icssRegExp.test(resourcePath);
124+
}
125+
126+
if (!isModules && !isIcss) {
121127
return false;
122128
}
123129
} else if (
@@ -128,7 +134,7 @@ function getModulesOptions(rawOptions, loaderContext) {
128134
}
129135

130136
let modulesOptions = {
131-
compileType: rawOptions.icss ? 'icss' : 'module',
137+
compileType: isIcss ? 'icss' : 'module',
132138
auto: true,
133139
mode: 'local',
134140
exportGlobals: false,
@@ -205,14 +211,6 @@ function getModulesOptions(rawOptions, loaderContext) {
205211
}
206212

207213
function normalizeOptions(rawOptions, loaderContext) {
208-
if (rawOptions.icss) {
209-
loaderContext.emitWarning(
210-
new Error(
211-
'The "icss" option is deprecated, use "modules.compileType: "icss"" instead'
212-
)
213-
);
214-
}
215-
216214
const modulesOptions = getModulesOptions(rawOptions, loaderContext);
217215

218216
return {

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

+70
Original file line numberDiff line numberDiff line change
@@ -12227,6 +12227,76 @@ Array [
1222712227

1222812228
exports[`"modules" option should work with the "[local]" placeholder for the "localIdentName" option: warnings 1`] = `Array []`;
1222912229

12230+
exports[`"modules" option should work with the "auto" by default for icss: errors 1`] = `Array []`;
12231+
12232+
exports[`"modules" option should work with the "auto" by default for icss: module 1`] = `
12233+
"// Imports
12234+
import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../src/runtime/api.js\\";
12235+
import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../src/index.js??[ident]!./vars.icss.css\\";
12236+
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
12237+
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_ICSS_IMPORT_0___, \\"\\", true);
12238+
// Module
12239+
___CSS_LOADER_EXPORT___.push([module.id, \\".className {\\\\n color: \\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\";\\\\n}\\\\n\\", \\"\\"]);
12240+
// Exports
12241+
___CSS_LOADER_EXPORT___.locals = {
12242+
\\"primary-color\\": \\"\\" + ___CSS_LOADER_ICSS_IMPORT_0___.locals[\\"primary-color\\"] + \\"\\"
12243+
};
12244+
export default ___CSS_LOADER_EXPORT___;
12245+
"
12246+
`;
12247+
12248+
exports[`"modules" option should work with the "auto" by default for icss: result 1`] = `
12249+
Array [
12250+
Array [
12251+
"../../src/index.js?[ident]!./modules/mode/icss/vars.icss.css",
12252+
"
12253+
",
12254+
"",
12255+
],
12256+
Array [
12257+
"./modules/mode/icss/relative.icss.css",
12258+
".className {
12259+
color: red;
12260+
}
12261+
",
12262+
"",
12263+
],
12264+
]
12265+
`;
12266+
12267+
exports[`"modules" option should work with the "auto" by default for icss: warnings 1`] = `Array []`;
12268+
12269+
exports[`"modules" option should work with the "auto" by default with "modules" filename: errors 1`] = `Array []`;
12270+
12271+
exports[`"modules" option should work with the "auto" by default with "modules" filename: module 1`] = `
12272+
"// Imports
12273+
import ___CSS_LOADER_API_IMPORT___ from \\"../../../../src/runtime/api.js\\";
12274+
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
12275+
// Module
12276+
___CSS_LOADER_EXPORT___.push([module.id, \\".af0LbFVUmIAO7cXelO_aA {\\\\n color: red;\\\\n}\\\\n\\", \\"\\"]);
12277+
// Exports
12278+
___CSS_LOADER_EXPORT___.locals = {
12279+
\\"relative\\": \\"af0LbFVUmIAO7cXelO_aA\\"
12280+
};
12281+
export default ___CSS_LOADER_EXPORT___;
12282+
"
12283+
`;
12284+
12285+
exports[`"modules" option should work with the "auto" by default with "modules" filename: result 1`] = `
12286+
Array [
12287+
Array [
12288+
"./modules/mode/relative.modules.css",
12289+
".af0LbFVUmIAO7cXelO_aA {
12290+
color: red;
12291+
}
12292+
",
12293+
"",
12294+
],
12295+
]
12296+
`;
12297+
12298+
exports[`"modules" option should work with the "auto" by default with "modules" filename: warnings 1`] = `Array []`;
12299+
1223012300
exports[`"modules" option should work with the "auto" by default: errors 1`] = `Array []`;
1223112301

1223212302
exports[`"modules" option should work with the "auto" by default: module 1`] = `
+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import relative from './relative.icss.css';
2+
3+
__export__ = relative;
4+
5+
export default relative;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
:import("./vars.icss.css") {
2+
IMPORTED_NAME: primary-color;
3+
}
4+
5+
.className {
6+
color: IMPORTED_NAME;
7+
}
8+
9+
:export {
10+
primary-color: IMPORTED_NAME
11+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
:export {
2+
primary-color: red;
3+
}
+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import relative from './relative.modules.css';
2+
3+
__export__ = relative;
4+
5+
export default relative;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.relative {
2+
color: red;
3+
}

test/modules-option.test.js

+28
Original file line numberDiff line numberDiff line change
@@ -737,6 +737,34 @@ describe('"modules" option', () => {
737737
expect(getErrors(stats)).toMatchSnapshot('errors');
738738
});
739739

740+
it('should work with the "auto" by default with "modules" filename', async () => {
741+
const compiler = getCompiler('./modules/mode/modules-2.js');
742+
const stats = await compile(compiler);
743+
744+
expect(
745+
getModuleSource('./modules/mode/relative.modules.css', stats)
746+
).toMatchSnapshot('module');
747+
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
748+
'result'
749+
);
750+
expect(getWarnings(stats)).toMatchSnapshot('warnings');
751+
expect(getErrors(stats)).toMatchSnapshot('errors');
752+
});
753+
754+
it('should work with the "auto" by default for icss', async () => {
755+
const compiler = getCompiler('./modules/mode/icss/icss.js');
756+
const stats = await compile(compiler);
757+
758+
expect(
759+
getModuleSource('./modules/mode/icss/relative.icss.css', stats)
760+
).toMatchSnapshot('module');
761+
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
762+
'result'
763+
);
764+
expect(getWarnings(stats)).toMatchSnapshot('warnings');
765+
expect(getErrors(stats)).toMatchSnapshot('errors');
766+
});
767+
740768
it('should work with the "auto" when it is "false"', async () => {
741769
const compiler = getCompiler('./modules/mode/modules.js', {
742770
modules: {

0 commit comments

Comments
 (0)