Is there a way to import CSS as a string that was processed by a preprocessor

[joshwooding]

I'm assuming that ?raw and ?inline behave the same way that they're documented on the rsbuild site: https://rsbuild.rs/guide/styling/css-usage#raw

My current build tooling (rollup) allows me to import my CSS as a string but have it processed, using ?raw gets me the output I want but without the processing and ?inline adds a lot of extra code to every file (calls to @rsbuild/core/compiled/css-loader).

Is there a way to get a hybrid approach where the CSS is just inlined as a string but it is still processed?

[Timeless0911]

In this case, you may need to customize module rules. By default, ?inline query syntax will use css-loader by default to generate runtime-related code. Run DEBUG=rsbuild rslib build to see the normalized Rspack config.

You can modify the default css-inline module rules with bunder chain.

e.g.

tools: {
  bundlerChain: (chain, { CHAIN_ID }) => {
    const rule = chain.module.rules.get(CHAIN_ID.RULE.CSS_INLINE);
    if (rule) {
      // remove css-loader
      rule.uses.delete(CHAIN_ID.USE.CSS);
      rule.type("asset/source");
    }
  },
},