File tree Expand file tree Collapse file tree 2 files changed +31
-6
lines changed Expand file tree Collapse file tree 2 files changed +31
-6
lines changed Original file line number Diff line number Diff line change @@ -27,6 +27,31 @@ import * as style from "./style.css";
2727console .log (style .myClass );
2828```
2929
30+ To restore 6.x behavior, please use:
31+
32+ ``` js
33+ module .exports = {
34+ module: {
35+ rules: [
36+ {
37+ test: / \. css$ / i ,
38+ loader: " css-loader" ,
39+ options: {
40+ modules: {
41+ namedExport: false ,
42+ exportLocalsConvention: ' as-is' ,
43+ //
44+ // or, if you prefer camelcase style
45+ //
46+ // exportLocalsConvention: 'camel-case-only'
47+ },
48+ },
49+ },
50+ ],
51+ },
52+ };
53+ ```
54+
3055* The ` modules.exportLocalsConvention ` has the value ` as-is ` when the ` modules.namedExport ` option is ` true ` and you don't specify a value
3156* Minimum supported webpack version is ` 5.27.0 `
3257* Minimum supported Node.js version is ` 18.12.0 `
Original file line number Diff line number Diff line change @@ -47,7 +47,7 @@ Then add the plugin to your `webpack` config. For example:
4747** file.js**
4848
4949``` js
50- import css from " file.css" ;
50+ import * as css from " file.css" ;
5151```
5252
5353** webpack.config.js**
@@ -1174,11 +1174,11 @@ Enables/disables ES modules named export for locals.
11741174``` js
11751175import * as styles from " ./styles.css" ;
11761176
1177+ // If using `exportLocalsConvention: "as-is"` (default value):
1178+ console .log (styles[" foo-baz" ], styles .bar );
1179+
11771180// If using `exportLocalsConvention: "camel-case-only"`:
11781181console .log (styles .fooBaz , styles .bar );
1179-
1180- // If using `exportLocalsConvention: "as-is"`:
1181- console .log (styles[" foo-baz" ], styles .bar );
11821182```
11831183
11841184You can enable a ES module named export using:
@@ -2337,8 +2337,8 @@ File treated as `CSS Module`.
23372337Using both ` CSS Module ` functionality as well as SCSS variables directly in JavaScript.
23382338
23392339``` jsx
2340- import svars from " variables.scss" ;
2341- import styles from " Component.module.scss" ;
2340+ import * as svars from " variables.scss" ;
2341+ import * as styles from " Component.module.scss" ;
23422342
23432343// Render DOM with CSS modules class name
23442344// <div className={styles.componentClass}>
You can’t perform that action at this time.
0 commit comments