When the type of css and less in the module is set to css, the css set in the component is invalidate

[ty-concision]

System Info

System Info:
System:
OS: macOS 13.4.1
CPU: (10) arm64 Apple M1 Pro
Memory: 32.00GB
Shell: 5.9 - /bin/zsh

Binaries:
Node: 14.20.1
pnpm: 7.9.0

Browsers:
Chrome: 114.0.5735.198（正式版本） (arm64)

npmPackages:
@rspack/cli: 0.2.6

Details

Here's a vue project, in which rrspack.config.js is configured as follows:
const { VueLoaderPlugin } = require("vue-loader");

/** @type {import('@rspack/cli').Configuration} */
const config = {
context: __dirname,
entry: {
main: "./src/main.js"
},
builtins: {
html: [
{
template: "./index.html"
}
]
},
devServer: {
historyApiFallback: true
},
devtool: false,
plugins: [new VueLoaderPlugin()],
module: {
rules: [
{
test: /.vue$/,
use: ["vue-loader"]
},
{
test: /.css$/,
use: ["postcss-loader"],
type: "css"
},
{
test: /.less$/,
use: ["less-loader"],
type: "css"
},
{
test: /.svg$/,
type: "asset/resource"
}
]
},
experiments: {
css: false,
},
};
module.exports = config;

Reproduce link

https://gitee.com/tuoy/rspack-vue-demo

Reproduce Steps

1. install pnpm install
2. run pnpm dev
3. Observe that the text style is not working. We expect the text color to be red. We have set this style in src/app.vue, but it is not working

[hardfist]

you mean css in js not working?

[h-a-n-a]

This turns out to be a vue2 support issue. Currently, only vue-style-loader and css-loader combination has been supported, which means experiments.css will not be working now.

Pull requests are welcome for supporting this feature. #3434

[admin00001]

dev环境可以配置 `
{
test: /.less$/,
use: [
'vue-style-loader',
'css-loader',
'postcss-loader',
{
loader: 'less-loader',
options: {

    }
  }
]

}
`

但是production 环境配置肯定不能是'vue-style-loader‘ 的，按照官网配置的如下：
`
{
test: /.less$/,
type: 'css',
use: [
'postcss-loader',
{
loader: 'less-loader',
options: {

    }
  }
]

}
`
虽然提取出一个css文件，但是都不是我想要的css文件，里面都是这些错误的代码

`
export{default }from "-!../../../node_modules/.pnpm/postcss-loader@7.0.2_postcss@8.4.21_webpack@5.76.1/node_modules/postcss-loader/dist/cjs.js!../../../node_modules/.pnpm/less-loader@11.1.0_less@4.1.3_webpack@5.76.1/node_modules/less-loader/dist/cjs.js??clonedRuleSet-5.use[1]!../../../node_modules/.pnpm/vue-loader@17.0.1_vue@3.2.47_webpack@5.76.1/node_modules/vue-loader/dist/index.js??ruleSet[0]!./black-list.vue?vue&type=style&index=0&id=fa7395a6&lang=less&scoped=true"; export * from "-!../../../node_modules/.pnpm/postcss-loader@7.0.2_postcss@8.4.21_webpack@5.76.1/node_modules/postcss-loader/dist/cjs.js!../../../node_modules/.pnpm/less-loader@11.1.0_less@4.1.3_webpack@5.76.1/node_modules/less-loader/dist/cjs.js??clonedRuleSet-5.use[1]!../../../node_modules/.pnpm/vue-loader@17.0.1_vue@3.2.47_webpack@5.76.1/node_modules/vue-loader/dist/index.js??ruleSet[0]!./black-list.vue?vue&type=style&index=0&id=fa7395a6&lang=less&scoped=true"

`

[jeromehan]

This turns out to be a vue2 support issue. Currently, only vue-style-loader and css-loader combination has been supported, which means experiments.css will not be working now.

Pull requests are welcome for supporting this feature. #3434

@h-a-n-a Is there any progress in this support?

[hardfist]

fixed by #4292