[Bug]: PostCSS plugins gets reinitialized on compile

[sibbng]

Version

System:
    OS: Windows 10 10.0.19045
  npmPackages:
    @rsbuild/core: ^1.0.1 => 1.0.7
    @rsbuild/plugin-vue: ^1.0.1 => 1.0.1

Details

Rsbuild re-initializes PostCSS plugins on each compile step. Both TailwindCSS and UnoCSS plugins expect it to be initialized only once.

https://github.com/tailwindlabs/tailwindcss/blob/6a50e6e1605cd8c4e071970211ae6254cc1c6313/packages/%40tailwindcss-postcss/src/index.ts#L40-L52

https://github.com/unocss/unocss/blob/55b505917d49865d1720d9819bf6ae5a0beb014f/packages/postcss/src/index.ts#L9-L10

When plugins gets reinitialized, they lose global state and this slows down compile step significantly. As far as I know, Vite, initialize PostCSS plugins body only once.

In the following reproduction, it gets even worse and plugins gets initialized twice on each re-compile.

Reproduce link

https://github.com/sibbng/rsbuild-vue3

Reproduce Steps

1. pnpm i
2. pnpm dev

[chenjiahan]

The reproduce link is 404:

I tried to reproduce this issue with tailwindcss v3, but I can not reproduce it:

[github-actions[bot]]

Hello @sibbng. Please provide a reproduction repository or online demo. For background, see Why reproductions are required. Thanks ❤️

[sibbng]

Sorry, it should be accessible now.

My reproductions uses Tailwind V4, but I observe same behaviour on UnoCSS too.

[inottn]

It appears to behave consistently with Vite, invoking the plugin for each module.

[github-actions[bot]]

As the issue was labelled with need reproduction, but no response in 5 days. This issue will be closed. Feel free to comment and reopen it if you have any further questions. For background, see Why reproductions are required.

由于该 issue 被标记为 "需要重现"，但在 5 天内没有回应，因此该 issue 将被关闭。如果你有任何进一步的问题，请随时发表评论并重新打开该 issue。背景请参考 为什么需要最小重现。

[sibbng]

@chenjiahan

I added reproduction to the issue.

[chenjiahan]

This issue is caused by postcss-load-config, see https://github.com/postcss/postcss-load-config/issues/225

A simple workaround is invoking the tailwindcss plugin in the postcss config file:

module.exports = {
  plugins: [require('@tailwindcss/postcss')()],
};

I will further investigate other solutions.