Skip to content

Commit

Permalink
feat: auto enable icss modules
Browse files Browse the repository at this point in the history
BREAKING CHANGE: Auto enable icss modules for all files for which /\.icss\.\w+$/i.test(filename)
  • Loading branch information
cap-Bernardito committed Sep 22, 2020
1 parent df111b8 commit 2f1573f
Show file tree
Hide file tree
Showing 8 changed files with 133 additions and 10 deletions.
18 changes: 8 additions & 10 deletions src/utils.js
Expand Up @@ -109,15 +109,21 @@ function getFilter(filter, resourcePath) {
};
}

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

function getModulesOptions(rawOptions, loaderContext) {
const { resourcePath } = loaderContext;
let isIcss;

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

if (!isModules) {
isIcss = icssRegExp.test(resourcePath);
}

if (!isModules && !isIcss) {
return false;
}
} else if (
Expand All @@ -128,7 +134,7 @@ function getModulesOptions(rawOptions, loaderContext) {
}

let modulesOptions = {
compileType: rawOptions.icss ? 'icss' : 'module',
compileType: isIcss ? 'icss' : 'module',
auto: true,
mode: 'local',
exportGlobals: false,
Expand Down Expand Up @@ -205,14 +211,6 @@ function getModulesOptions(rawOptions, loaderContext) {
}

function normalizeOptions(rawOptions, loaderContext) {
if (rawOptions.icss) {
loaderContext.emitWarning(
new Error(
'The "icss" option is deprecated, use "modules.compileType: "icss"" instead'
)
);
}

const modulesOptions = getModulesOptions(rawOptions, loaderContext);

return {
Expand Down
70 changes: 70 additions & 0 deletions test/__snapshots__/modules-option.test.js.snap
Expand Up @@ -12227,6 +12227,76 @@ Array [

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

exports[`"modules" option should work with the "auto" by default for icss: errors 1`] = `Array []`;

exports[`"modules" option should work with the "auto" by default for icss: module 1`] = `
"// Imports
import ___CSS_LOADER_API_IMPORT___ from \\"../../../../../src/runtime/api.js\\";
import ___CSS_LOADER_ICSS_IMPORT_0___ from \\"-!../../../../../src/index.js??[ident]!./vars.icss.css\\";
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
___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 should work with the "auto" by default for icss: result 1`] = `
Array [
Array [
"../../src/index.js?[ident]!./modules/mode/icss/vars.icss.css",
"
",
"",
],
Array [
"./modules/mode/icss/relative.icss.css",
".className {
color: red;
}
",
"",
],
]
`;

exports[`"modules" option should work with the "auto" by default for icss: warnings 1`] = `Array []`;

exports[`"modules" option should work with the "auto" by default with "modules" filename: errors 1`] = `Array []`;

exports[`"modules" option should work with the "auto" by default with "modules" filename: module 1`] = `
"// Imports
import ___CSS_LOADER_API_IMPORT___ from \\"../../../../src/runtime/api.js\\";
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
// Module
___CSS_LOADER_EXPORT___.push([module.id, \\".af0LbFVUmIAO7cXelO_aA {\\\\n color: red;\\\\n}\\\\n\\", \\"\\"]);
// Exports
___CSS_LOADER_EXPORT___.locals = {
\\"relative\\": \\"af0LbFVUmIAO7cXelO_aA\\"
};
export default ___CSS_LOADER_EXPORT___;
"
`;

exports[`"modules" option should work with the "auto" by default with "modules" filename: result 1`] = `
Array [
Array [
"./modules/mode/relative.modules.css",
".af0LbFVUmIAO7cXelO_aA {
color: red;
}
",
"",
],
]
`;

exports[`"modules" option should work with the "auto" by default with "modules" filename: warnings 1`] = `Array []`;

exports[`"modules" option should work with the "auto" by default: errors 1`] = `Array []`;

exports[`"modules" option should work with the "auto" by default: module 1`] = `
Expand Down
5 changes: 5 additions & 0 deletions test/fixtures/modules/mode/icss/icss.js
@@ -0,0 +1,5 @@
import relative from './relative.icss.css';

__export__ = relative;

export default relative;
11 changes: 11 additions & 0 deletions test/fixtures/modules/mode/icss/relative.icss.css
@@ -0,0 +1,11 @@
:import("./vars.icss.css") {
IMPORTED_NAME: primary-color;
}

.className {
color: IMPORTED_NAME;
}

:export {
primary-color: IMPORTED_NAME
}
3 changes: 3 additions & 0 deletions test/fixtures/modules/mode/icss/vars.icss.css
@@ -0,0 +1,3 @@
:export {
primary-color: red;
}
5 changes: 5 additions & 0 deletions test/fixtures/modules/mode/modules-2.js
@@ -0,0 +1,5 @@
import relative from './relative.modules.css';

__export__ = relative;

export default relative;
3 changes: 3 additions & 0 deletions test/fixtures/modules/mode/relative.modules.css
@@ -0,0 +1,3 @@
.relative {
color: red;
}
28 changes: 28 additions & 0 deletions test/modules-option.test.js
Expand Up @@ -737,6 +737,34 @@ describe('"modules" option', () => {
expect(getErrors(stats)).toMatchSnapshot('errors');
});

it('should work with the "auto" by default with "modules" filename', async () => {
const compiler = getCompiler('./modules/mode/modules-2.js');
const stats = await compile(compiler);

expect(
getModuleSource('./modules/mode/relative.modules.css', stats)
).toMatchSnapshot('module');
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
'result'
);
expect(getWarnings(stats)).toMatchSnapshot('warnings');
expect(getErrors(stats)).toMatchSnapshot('errors');
});

it('should work with the "auto" by default for icss', async () => {
const compiler = getCompiler('./modules/mode/icss/icss.js');
const stats = await compile(compiler);

expect(
getModuleSource('./modules/mode/icss/relative.icss.css', stats)
).toMatchSnapshot('module');
expect(getExecutedCode('main.bundle.js', compiler, stats)).toMatchSnapshot(
'result'
);
expect(getWarnings(stats)).toMatchSnapshot('warnings');
expect(getErrors(stats)).toMatchSnapshot('errors');
});

it('should work with the "auto" when it is "false"', async () => {
const compiler = getCompiler('./modules/mode/modules.js', {
modules: {
Expand Down

0 comments on commit 2f1573f

Please sign in to comment.