import .scss build to js, the exported mapping is inconsistent with the usage【Urgent!!】

[zaohuayudie]

Bug report

What is the current behavior?

1. scss导入方式

import Style from 'index.scss';

index.scss
.tCard {...}

jsx use class
className={Style.tCard}

2. rspack.config.js 的module 配置

module: {
    generator: {
      'css/auto': {
        exportsOnly: false,
        exportsConvention: 'camel-case',
        localIdentName: '[local]',
      },
      css: {
        exportsOnly: false,
        exportsConvention: 'camel-case',
        localIdentName: '[local]',
      },
      'css/module': {
        exportsOnly: false,
        exportsConvention: 'camel-case',
        localIdentName: '[local]',
      },
    },
    rules: [
      {
        test: /\.(j|t)s$/,
        exclude: [/[\\/]node_modules[\\/]/],
        loader: 'builtin:swc-loader',
        options: {
          sourceMap: false,
          jsc: {
            parser: {
              syntax: 'typescript',
            },
          },
        },
        type: 'javascript/auto',
        // sideEffects: false, // esm导入要加这个才能解决
      },
      {
        test: /\.less$/,
        use: [
          {
            loader: 'less-loader',
            options: {
              lessOptions: { javascriptEnabled: true },
            },
          },
        ],
        type: 'css/auto', // set to 'css/auto' if you want to support '*.module.less' as CSS Module, otherwise set type to 'css'
      },
      {
        test: /\.(sass|scss)$/,
        use: [
          {
            loader: 'sass-loader',
            options: {
              implementation: require('dart-sass'),
              outputStyle: 'expanded',
            },
          },
        ],
        type: 'css/module', 
      },
      {
        test: /\.css$/i,
        use: [
          {
            loader: 'css-loader',
          },
        ],
        type: 'css/auto',
      },
      {
        test: /\.(jpe?g|png|gif|ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/,
        type: 'asset',
      },
      {
        test: /\.(jsx?|tsx?)$/,
        use: [
          {
            loader: 'builtin:swc-loader',
            options: {
              sourceMap: false,
              jsc: {
                parser: {
                  syntax: 'typescript',
                  tsx: true,
                },
                transform: {
                  react: {
                    runtime: 'automatic',
                    development: isDev,
                    refresh: isDev,
                  },
                },
              },
              env: {
                targets: [
                  'chrome >= 87',
                  'edge >= 88',
                  'firefox >= 78',
                  'safari >= 14',
                ],
              },
            },
          },
        ],
      },
    ],
  },

3. 出现class引用多了default，实际导出并没有

编译产物片段，导出为exports，并没有导出default。

55978: function (e, t, r) {
        'use strict';
        r.r(
          (e.exports = {
            'b-card__title': 'b-card__title',
            bCardTitle: 'b-card__title',
            inProgress: 'inProgress',
            infoBox: 'infoBox',
            infoBoxItem: 'infoBoxItem',
            pdf: 'pdf',
            't-card': 't-card',
            tCard: 't-card',
            't-card__body': 't-card__body',
            tCardBody: 't-card__body',
            't-card__header': 't-card__header',
            tCardHeader: 't-card__header',
            't-card__header-wrapper': 't-card__header-wrapper',
            tCardHeaderWrapper: 't-card__header-wrapper',
            't-card__title': 't-card__title',
            tCardTitle: 't-card__title',
          }),
        );
      },

If the current behavior is a bug, please provide the steps to reproduce.

What is the expected behavior?
import的scss文件，编译后的能正常使用构建的css。
导出对应map与实际使用一致。

加急！！！！

Other relevant information:
rspack version: 0.6.1
Node.js version: v18.17.1
Operating System: Mac M2
Additional tools:

[alexander-akait]

Please read migration guide - https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md#700-2024-04-04

And use import * as style from 'index.scss';

Also don't use css-loader and type: 'css/auto' together, it doesn't make sense, css-loader just ignore eveyrthing

[alexander-akait]

You need to use css-loader or type: "css/*"

[zaohuayudie]

Please read migration guide - https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md#700-2024-04-04

And use import * as style from 'index.scss';

Also don't use css-loader and type: 'css/auto' together, it doesn't make sense, css-loader just ignore eveyrthing

Thank you very much. Solved my problem。