build(dev-deps): Bump css-loader from 6.10.0 to 7.1.2 (#7668)

- [x] Тест
  - [x] Сравнил `packages/vkui/dist/` в `master` и в `imirdzhamolov/issue6805/tech/css-loader-v7` – без изменений
  - [x] Локально проверил0 документации **Styleguide** и **Storybook** – стили не поехали

h2. Описание

С `v7.0.0` по умолчанию используется именованный экспорт CSS-модулей, поэтому отключил это поведение через опцию `namedExport: false` (см. подробнее в релиз ноуте https://github.com/webpack-contrib/css-loader/blob/v7.1.0/CHANGELOG.md). Расширил документацию `styleguide/pages/css_modules.md` на эту тему.

Также, для подстраховки, явно выставил `modules: false` там, где не нужны CSS-модули.

h2. Release notes

h2. Документация

- Раздел **CSS Modules** дополнен информацией про использование пакета с `'css-loader' >= 7.0.0`.

benchmark/runtime/webpack.config.mjs

@@ -77,7 +77,7 @@ const webpackConfig = {
       {
         test: /\.css$/i,
         exclude: /node_modules/,
-        use: [MiniCssExtractPlugin.loader, 'css-loader'],
+        use: [MiniCssExtractPlugin.loader, { loader: 'css-loader', options: { modules: false } }],
       },
       {
         test: /\.module.css$/,
@@ -86,7 +86,7 @@ const webpackConfig = {
           MiniCssExtractPlugin.loader,
           {
             loader: 'css-loader',
-            options: { importLoaders: 1 },
+            options: { modules: false, importLoaders: 1 },
           },
           {
             loader: 'postcss-loader',

package.json

@@ -38,7 +38,7 @@
     "autoprefixer": "^10.4.20",
     "concurrently": "^9.0.1",
     "cross-env": "^7.0.3",
-    "css-loader": "^6.10.0",
+    "css-loader": "^7.1.2",
     "css-minimizer-webpack-plugin": "^7.0.0",
     "cssnano": "^7.0.6",
     "dotenv": "^16.4.5",

styleguide/pages/css_modules.md

@@ -83,7 +83,14 @@ module.exports = {
       {
         test: /\.css$/,
         include: /node_modules\/@vkontakte\/vkui/,
-        use: ['css-loader'],
+        use: [{
+          loader: 'css-loader',
+          /* Используем следующие опции в случае использования `css-loader >= 7.0.0` (см. https://github.com/webpack-contrib/css-loader/blob/v7.1.0/CHANGELOG.md) */
+          // options: {
+          //   namedExport: false,
+          //   exportLocalsConvention: 'as-is',
+          // }
+        ],
       },
     ],
   },

webpack.common.config.js

@@ -49,7 +49,7 @@ const rules = [
     exclude: sandbox ? new RegExp(`${sandbox}|\\.module\\.css$`) : /\.module\.css$/,
     use: [
       styleLoader,
-      'css-loader',
+      { loader: 'css-loader', options: { modules: false } },
       {
         loader: 'postcss-loader',
         options: {
@@ -69,6 +69,9 @@ const rules = [
         loader: 'css-loader',
         options: {
           modules: {
+            // см. https://github.com/webpack-contrib/css-loader/blob/v7.1.0/CHANGELOG.md
+            namedExport: false,
+            exportLocalsConvention: 'as-is',
             localIdentName: '[folder]__[local]--[hash:base64:5]',
           },
         },
@@ -94,6 +97,7 @@ if (sandbox) {
       {
         loader: 'css-loader',
         options: {
+          modules: false,
           importLoaders: 1,
         },
       },

yarn.lock

@@ -3783,7 +3783,7 @@ __metadata:
     autoprefixer: "npm:^10.4.20"
     concurrently: "npm:^9.0.1"
     cross-env: "npm:^7.0.3"
-    css-loader: "npm:^6.10.0"
+    css-loader: "npm:^7.1.2"
     css-minimizer-webpack-plugin: "npm:^7.0.0"
     cssnano: "npm:^7.0.6"
     dotenv: "npm:^16.4.5"