From 9c165a4b9152d1bb5d8738f9b7775907f5483295 Mon Sep 17 00:00:00 2001
From: Alexander Akait <4567934+alexander-akait@users.noreply.github.com>
Date: Mon, 8 Apr 2024 20:07:07 +0300
Subject: [PATCH] docs: update migration guide (#1586)

---
 CHANGELOG.md | 25 +++++++++++++++++++++++++
 README.md    | 12 ++++++------
 2 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a2b512ec..672a0734 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,6 +27,31 @@ import * as style from "./style.css";
 console.log(style.myClass);
 ```
 
+To restore 6.x behavior, please use:
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        loader: "css-loader",
+        options: {
+          modules: {
+            namedExport: false,
+            exportLocalsConvention: 'as-is',
+            //
+            // or, if you prefer camelcase style
+            //
+            // exportLocalsConvention: 'camel-case-only'
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
 * The `modules.exportLocalsConvention` has the value `as-is` when the `modules.namedExport` option is `true` and you don't specify a value
 * Minimum supported webpack version is `5.27.0`
 * Minimum supported Node.js version is `18.12.0`
diff --git a/README.md b/README.md
index 54b0a30a..eeeb73ca 100644
--- a/README.md
+++ b/README.md
@@ -47,7 +47,7 @@ Then add the plugin to your `webpack` config. For example:
 **file.js**
 
 ```js
-import css from "file.css";
+import * as css from "file.css";
 ```
 
 **webpack.config.js**
@@ -1174,11 +1174,11 @@ Enables/disables ES modules named export for locals.
 ```js
 import * as styles from "./styles.css";
 
+// If using `exportLocalsConvention: "as-is"` (default value):
+console.log(styles["foo-baz"], styles.bar);
+
 // If using `exportLocalsConvention: "camel-case-only"`:
 console.log(styles.fooBaz, styles.bar);
-
-// If using `exportLocalsConvention: "as-is"`:
-console.log(styles["foo-baz"], styles.bar);
 ```
 
 You can enable a ES module named export using:
@@ -2337,8 +2337,8 @@ File treated as `CSS Module`.
 Using both `CSS Module` functionality as well as SCSS variables directly in JavaScript.
 
 ```jsx
-import svars from "variables.scss";
-import styles from "Component.module.scss";
+import * as svars from "variables.scss";
+import * as styles from "Component.module.scss";
 
 // Render DOM with CSS modules class name
 // <div className={styles.componentClass}>