Skip to content

Commit 996307b

Browse files
cap-Bernarditocap-Bernardito
committed
refactor: namedExport option is enabled by default
1 parent 1167ab4 commit 996307b

File tree

12 files changed

+841
-1182
lines changed

12 files changed

+841
-1182
lines changed

‎README.md‎

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -902,7 +902,7 @@ module.exports = {
902902
##### `namedExport`
903903

904904
Type: `Boolean`
905-
Default: `false`
905+
Default: `true`
906906

907907
Enables/disables ES modules named export for locals.
908908

@@ -933,6 +933,27 @@ You can enable a ES module named export using:
933933

934934
**webpack.config.js**
935935

936+
```js
937+
module.exports = {
938+
module: {
939+
rules: [
940+
{
941+
test: /\.css$/i,
942+
loader: "css-loader",
943+
options: {
944+
esModule: true,
945+
modules: true,
946+
},
947+
},
948+
],
949+
},
950+
};
951+
```
952+
953+
You can disable a ES module named export using:
954+
955+
**webpack.config.js**
956+
936957
```js
937958
module.exports = {
938959
module: {
@@ -943,7 +964,7 @@ module.exports = {
943964
options: {
944965
esModule: true,
945966
modules: {
946-
namedExport: true,
967+
namedExport: false,
947968
},
948969
},
949970
},
@@ -988,7 +1009,7 @@ Style of exported class names.
9881009

9891010
By default, the exported JSON keys mirror the class names (i.e `asIs` value).
9901011

991-
> ⚠ Only `camelCaseOnly` value allowed if you set the `namedExport` value to `true`.
1012+
> ⚠ Only `camelCaseOnly` and `dashesOnly` values allowed if the `namedExport` option is `true`.
9921013
9931014
| Name | Type | Description |
9941015
| :-------------------: | :--------: | :----------------------------------------------------------------------------------------------- |

‎src/utils.js‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -368,7 +368,7 @@ function getModulesOptions(rawOptions, loaderContext) {
368368
localIdentRegExp: undefined,
369369
// eslint-disable-next-line no-undefined
370370
getLocalIdent: undefined,
371-
namedExport: false,
371+
namedExport: true,
372372
exportLocalsConvention: "asIs",
373373
exportOnlyLocals: false,
374374
};
@@ -401,18 +401,19 @@ function getModulesOptions(rawOptions, loaderContext) {
401401
return false;
402402
}
403403
}
404-
405-
if (
406-
rawOptions.modules.namedExport === true &&
407-
typeof rawOptions.modules.exportLocalsConvention === "undefined"
408-
) {
409-
modulesOptions.exportLocalsConvention = "camelCaseOnly";
410-
}
411404
}
412405

413406
modulesOptions = { ...modulesOptions, ...(rawOptions.modules || {}) };
414407
}
415408

409+
if (
410+
modulesOptions.namedExport === true &&
411+
(typeof rawOptions.modules === "undefined" ||
412+
typeof rawOptions.modules.exportLocalsConvention === "undefined")
413+
) {
414+
modulesOptions.exportLocalsConvention = "camelCaseOnly";
415+
}
416+
416417
if (typeof modulesOptions.mode === "function") {
417418
modulesOptions.mode = modulesOptions.mode(loaderContext.resourcePath);
418419
}

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

Lines changed: 14 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
1212
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
1313
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
1414
// Module
15-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
15+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.css-class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
1616
// Exports
1717
export default ___CSS_LOADER_EXPORT___;
1818
"
@@ -34,7 +34,7 @@ Array [
3434
3535
/* Comment */
3636
37-
.class {
37+
.css-class {
3838
color: red;
3939
background: url(replaced_file_protocol_/webpack/public/path/img.png);
4040
}
@@ -58,7 +58,7 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
5858
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
5959
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
6060
// Module
61-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
61+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.css-class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
6262
// Exports
6363
module.exports = ___CSS_LOADER_EXPORT___;
6464
"
@@ -80,7 +80,7 @@ Array [
8080
8181
/* Comment */
8282
83-
.class {
83+
.css-class {
8484
color: red;
8585
background: url(/webpack/public/path/img.png);
8686
}
@@ -104,7 +104,7 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
104104
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
105105
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
106106
// Module
107-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
107+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.css-class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
108108
// Exports
109109
export default ___CSS_LOADER_EXPORT___;
110110
"
@@ -126,7 +126,7 @@ Array [
126126
127127
/* Comment */
128128
129-
.class {
129+
.css-class {
130130
color: red;
131131
background: url(replaced_file_protocol_/webpack/public/path/img.png);
132132
}
@@ -150,11 +150,9 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
150150
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
151151
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
152152
// Module
153-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.oFwPvuANP2XsfGir7HPVz {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
153+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n._2uAne49JHw-DEh-AwAARSJ {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
154154
// Exports
155-
___CSS_LOADER_EXPORT___.locals = {
156-
\\"class\\": \\"oFwPvuANP2XsfGir7HPVz\\"
157-
};
155+
export const cssClass = \\"_2uAne49JHw-DEh-AwAARSJ\\";
158156
export default ___CSS_LOADER_EXPORT___;
159157
"
160158
`;
@@ -175,7 +173,7 @@ Array [
175173
176174
/* Comment */
177175
178-
.oFwPvuANP2XsfGir7HPVz {
176+
._2uAne49JHw-DEh-AwAARSJ {
179177
color: red;
180178
background: url(replaced_file_protocol_/webpack/public/path/img.png);
181179
}
@@ -199,11 +197,9 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
199197
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
200198
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
201199
// Module
202-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.oFwPvuANP2XsfGir7HPVz {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
200+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n._2uAne49JHw-DEh-AwAARSJ {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
203201
// Exports
204-
___CSS_LOADER_EXPORT___.locals = {
205-
\\"class\\": \\"oFwPvuANP2XsfGir7HPVz\\"
206-
};
202+
export const cssClass = \\"_2uAne49JHw-DEh-AwAARSJ\\";
207203
export default ___CSS_LOADER_EXPORT___;
208204
"
209205
`;
@@ -224,7 +220,7 @@ Array [
224220
225221
/* Comment */
226222
227-
.oFwPvuANP2XsfGir7HPVz {
223+
._2uAne49JHw-DEh-AwAARSJ {
228224
color: red;
229225
background: url(replaced_file_protocol_/webpack/public/path/img.png);
230226
}
@@ -248,7 +244,7 @@ var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(function(i){return i[1
248244
___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);
249245
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
250246
// Module
251-
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
247+
___CSS_LOADER_EXPORT___.push([module.id, \\"@charset \\\\\\"UTF-8\\\\\\";\\\\n\\\\n/* Comment */\\\\n\\\\n.css-class {\\\\n color: red;\\\\n background: url(\\" + ___CSS_LOADER_URL_REPLACEMENT_0___ + \\");\\\\n}\\\\n\\", \\"\\"]);
252248
// Exports
253249
export default ___CSS_LOADER_EXPORT___;
254250
"
@@ -270,7 +266,7 @@ Array [
270266
271267
/* Comment */
272268
273-
.class {
269+
.css-class {
274270
color: red;
275271
background: url(replaced_file_protocol_/webpack/public/path/img.png);
276272
}

‎test/__snapshots__/loader.test.js.snap‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -692,7 +692,7 @@ Array [
692692
color: white;
693693
}
694694
695-
._1-Aa1c8UQML46IWY0FjGXT {
695+
._3Zw4sH94YLbVXoB8_gOEaK {
696696
from: custom;
697697
}",
698698
"",
@@ -707,7 +707,7 @@ Array [
707707
color: white;
708708
}
709709
710-
._1-Aa1c8UQML46IWY0FjGXT {
710+
._3Zw4sH94YLbVXoB8_gOEaK {
711711
from: custom;
712712
}",
713713
"",
@@ -718,7 +718,7 @@ Array [
718718
color: red;
719719
}
720720
721-
._2kEhhupr-6tgHnCC_d4yO8 {
721+
._16B0YrzWrgyC8YandYnyyt {
722722
from: custom;
723723
}",
724724
"",

0 commit comments

Comments
 (0)