[POC] feat(core): support experimental Rspack builtin CSS by intellild · Pull Request #8101 · web-infra-dev/rsbuild

intellild · 2026-07-13T05:00:40Z

Summary

This PR adds an experimental Rsbuild experiments.css option for using Rspack's built-in CSS module types. When enabled, CSS, CSS Modules, ?inline, Less, and Sass use the native css/* pipeline without css-loader, style-loader, or CssExtractRspackPlugin; native parser and generator options can be set through tools.css.

Rsbuild needs a dedicated option because tools.rspack can be a sync or async callback and runs after Rsbuild creates its CSS rules. Reading tools.rspack.experiments.css therefore cannot reliably select the internal CSS pipeline.

export default {
  experiments: {
    css: true,
  },
};

CSS ?url imports and Vue SFC CSS Modules are currently unsupported in this mode and emit warnings.

by OpenAI Codex

coderabbitai · 2026-07-13T05:00:47Z

📝 Walkthrough

Walkthrough

Adds a top-level experiments.css configuration with built-in CSS parser and generator options. The CSS plugin configures Rspack built-in CSS rules and retains the css-loader pipeline when disabled. Less and Sass module rules mirror CSS branch metadata, Tailwind handles available CSS module branches, and Vue warns about unsupported SFC CSS Modules. Tests cover rule shapes, loaders, warnings, module modes, style exports, and end-to-end configuration.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title clearly and concisely summarizes the main change: experimental built-in Rspack CSS support.
Description check	✅ Passed	The description is directly related and accurately explains the experimental CSS feature and its limitations.

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands.}

intellild · 2026-07-13T05:59:01Z

@coderabbitai review

coderabbitai · 2026-07-13T05:59:07Z

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

intellild · 2026-07-13T06:00:00Z

@codex review

coderabbitai

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/core/src/plugins/css.ts`:
- Around line 257-265: Update isBuiltinCssEnabled in the core CSS plugin and the
corresponding builtin-CSS checks in the Less and Sass plugins to inspect the
finalized Rspack configuration rather than config.tools.rspack directly. Resolve
array and callback-based ToolsRspackConfig forms before reading experiments.css,
and preserve native CSS handling so css-loader/extract loaders are not installed
when the final config enables builtin CSS.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 6c3a5786-10f4-4ab2-8735-30b04db40c5c

📥 Commits

Reviewing files that changed from the base of the PR and between cd66e62 and c1bdea4.

📒 Files selected for processing (8)

packages/core/src/loader/cssUrlLoader.ts
packages/core/src/plugins/css.ts
packages/core/src/types/config.ts
packages/core/tests/css.test.ts
packages/plugin-less/src/index.ts
packages/plugin-less/tests/index.test.ts
packages/plugin-sass/src/index.ts
packages/plugin-sass/tests/index.test.ts

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: c1bdea49e8

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-13T07:13:35Z

@coderabbitai review

coderabbitai · 2026-07-13T07:13:40Z

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

intellild · 2026-07-13T08:55:47Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 8bd1db7e25

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-13T10:38:26Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 7fd3536f87

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-13T10:48:26Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 7fd3536f87

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-13T13:32:26Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 2c87092eb8

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-14T03:23:10Z

@codex review

intellild · 2026-07-14T03:38:09Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: cb2a65a9db

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-14T06:43:49Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: ce4405c4e1

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-14T07:48:40Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 5982dcb06c

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-14T08:50:16Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: eb83dd426b

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

intellild · 2026-07-14T11:07:57Z

@codex review

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 9847eccc39

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 4020e3f2eb

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

chatgpt-codex-connector · 2026-07-15T08:28:38Z

+            .parser({
+              exportType: 'text',
+              namedExports: true,
+            })


Merge native parser options into inline CSS rule

When experiments.css is enabled and a user configures native parser options via tools.css.parser (for example url: false, import: false, or resolveImport), this rule-level parser object overrides the module.parser['css/auto'] options that applyBuiltinCssConfig just merged. As a result, import './style.css?inline' still resolves url()/@import using Rspack defaults instead of the user's built-in CSS parser settings; merge config.tools.css?.parser into this inline parser and then force exportType: 'text'.

Useful? React with 👍 / 👎.

chenjiahan · 2026-07-15T08:32:07Z

+ * Only takes effect when `experiments.css` is enabled.
+ * @experimental
+ */
+export interface ToolsCSSConfig {


Rspack's builtin CSS support is not a "tool", we should avoid providing a tools.* config for builtin CSS

chenjiahan · 2026-07-15T08:33:50Z

I’d prefer to keep this PR focused on the core changes and exclude any plugin-related changes.

chenjiahan · 2026-07-15T08:34:54Z

+    expect(mainRule).toBeTruthy();
+    expect(cssModulesRule).toBeTruthy();
+    expect(urlRule).toBeUndefined();
+    expect(inlineRule).toMatchObject({
+      type: 'css/auto',
+      parser: {
+        exportType: 'text',
+        namedExports: true,
+      },
+    });
+    expect(inlineRule).not.toHaveProperty('generator');
+    expect(loaders.some((loader) => loader.includes('css-loader/index'))).toBe(false);
+    expect(loaders.some((loader) => loader.includes('style-loader/index'))).toBe(false);
+    expect(loaders.some((loader) => loader.includes('cssExtractLoader'))).toBe(false);
+    expect(loaders).toContain('builtin:lightningcss-loader');
+    expect(matchPlugin(rspackConfigs[0], 'CssExtractRspackPlugin')).toBeFalsy();
+    expect(rspackConfigs[0].experiments?.css).toBe(true);
+    expect(rspackConfigs[0].module?.parser).toMatchObject({
+      'css/auto': {
+        import: false,
+        namedExports: true,
+      },
+    });
+    expect(rspackConfigs[0].module?.parser?.['css/auto']).not.toHaveProperty('url');
+    expect(rspackConfigs[0].module?.generator).toMatchObject({
+      'css/auto': {
+        exportsConvention: 'dashes-only',
+        exportsOnly: false,
+        localIdentName: 'custom__[local]',
+      },
+    });


Why not use test snapshots

chenjiahan · 2026-07-15T08:37:21Z


+type BuiltinCssRuleType = 'css' | 'css/auto' | 'css/global' | 'css/module';
+
+const CSS_MODULE_REGEX = /\.module(s)?\.css$/i;


You can reuse the regex in packages/core/src/helpers/css.ts

chenjiahan · 2026-07-15T08:39:24Z

+  'dashes-only',
+] as const;
+
+const builtinCssExportConventionMap = Object.fromEntries(


Could we avoid computing this at the top level? Since it’s only used under certain conditions, initializing it eagerly adds unnecessary overhead

chenjiahan

Let’s avoid experiments.css: it conflicts with Rspack v1’s option and doesn’t clearly describe the Rsbuild behavior change.

coderabbitai Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts Outdated

chatgpt-codex-connector Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/loader/cssUrlLoader.ts Outdated

chatgpt-codex-connector Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/loader/cssUrlLoader.ts Outdated

Comment thread packages/core/src/loader/cssUrlLoader.ts Outdated

intellild changed the title ~~feat(core): support Rspack builtin CSS~~ feat(core): support experimental Rspack builtin CSS Jul 13, 2026

chatgpt-codex-connector Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

Comment thread packages/core/src/plugins/css.ts Outdated

chatgpt-codex-connector Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

Comment thread packages/core/src/plugins/css.ts Outdated

Comment thread packages/core/src/plugins/css.ts Outdated

chatgpt-codex-connector Bot reviewed Jul 13, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts Outdated

Comment thread packages/core/src/plugins/css.ts

chatgpt-codex-connector Bot reviewed Jul 14, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts Outdated

Comment thread packages/core/src/plugins/css.ts

chatgpt-codex-connector Bot reviewed Jul 14, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

chatgpt-codex-connector Bot reviewed Jul 14, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

chatgpt-codex-connector Bot reviewed Jul 14, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

Comment thread packages/plugin-sass/src/index.ts

Comment thread packages/plugin-less/src/index.ts

chatgpt-codex-connector Bot reviewed Jul 14, 2026

View reviewed changes

Comment thread packages/core/src/plugins/css.ts

intellild force-pushed the codex/feat-rspack-builtin-css branch from e6316ae to a72a04b Compare July 15, 2026 07:11

feat(core): support Rspack builtin CSS

4020e3f

intellild force-pushed the codex/feat-rspack-builtin-css branch from a72a04b to 4020e3f Compare July 15, 2026 07:22

intellild marked this pull request as ready for review July 15, 2026 08:19

intellild requested a review from chenjiahan July 15, 2026 08:19

chatgpt-codex-connector Bot reviewed Jul 15, 2026

View reviewed changes

chenjiahan reviewed Jul 15, 2026

View reviewed changes

intellild marked this pull request as draft July 15, 2026 08:42

chenjiahan requested changes Jul 15, 2026

View reviewed changes

intellild changed the title ~~feat(core): support experimental Rspack builtin CSS~~ [POC] feat(core): support experimental Rspack builtin CSS Jul 16, 2026


		type BuiltinCssRuleType = 'css' \| 'css/auto' \| 'css/global' \| 'css/module';

		const CSS_MODULE_REGEX = /\.module(s)?\.css$/i;

Uh oh!

Uh oh!

Conversation

intellild commented Jul 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Uh oh!

coderabbitai Bot commented Jul 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

❌ Failed checks (1 warning)

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

coderabbitai Bot commented Jul 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

coderabbitai Bot commented Jul 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

Uh oh!

intellild commented Jul 13, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

intellild commented Jul 14, 2026

Uh oh!

intellild commented Jul 14, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

Uh oh!

intellild commented Jul 14, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

intellild commented Jul 13, 2026 •

edited

Loading

coderabbitai Bot commented Jul 13, 2026 •

edited

Loading

coderabbitai Bot commented Jul 13, 2026 •

edited

Loading

coderabbitai Bot commented Jul 13, 2026 •

edited

Loading