fix(create-rsbuild): update React Compiler babel config

[chenjiahan]

Summary

Update the create-rsbuild React Compiler templates with the React docs change so Babel includes .js, .jsx, .ts, and .tsx files and excludes node_modules.

Related Links

• docs: widen React Compiler include to optimize custom hooks in .ts files #7392

[gemini-code-assist]

Summary of Changes

Hello, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request refines the integration of the React Compiler within create-rsbuild by updating its Babel configuration to match current React best practices. It ensures that the compiler correctly targets a broader range of JavaScript and TypeScript files while avoiding node_modules, and enhances the testing suite to validate these configuration changes and the compilation of custom hooks.

Highlights

• Babel Configuration Sync: Synchronized the create-rsbuild React Compiler templates' Babel configuration to align with React documentation, ensuring it processes .js, .jsx, .ts, and .tsx files while excluding node_modules.
• E2E Test Enhancement: Updated the React Compiler Babel end-to-end test case to include a custom hook in a plain .js file and verify its successful compilation in the generated bundle.
• Test Coverage Expansion: Expanded create-rsbuild test coverage to specifically assert the correctness of the generated Babel include and exclude settings.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[Copilot]

Pull request overview

Updates the React Compiler Babel configuration used by create-rsbuild templates and related e2e coverage so React Compiler runs on all JS/TS source files (including hooks in plain .js/.ts) while avoiding node_modules.

Changes:

• Widened React Compiler Babel include to /\.[jt]sx?$/ and added exclude for node_modules in the React Compiler templates and the Babel e2e case.
• Updated the React Compiler Babel e2e case to compile a custom hook defined in a plain .js file and added bundle assertions.
• Added create-rsbuild e2e assertions to ensure the generated template includes the expected Babel include/exclude settings.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
packages/create-rsbuild/template-react-compiler/react-ts/rsbuild.config.ts	Sync template Babel include/exclude patterns with updated React Compiler guidance.
packages/create-rsbuild/template-react-compiler/react-js/rsbuild.config.js	Same include/exclude update for the JS template variant.
e2e/cases/plugin-react/react-compiler-babel/src/useCounter.js	Adds a plain .js hook to ensure non-JSX files get compiled.
e2e/cases/plugin-react/react-compiler-babel/src/App.jsx	Uses the new hook so the build output should reflect hook compilation.
e2e/cases/plugin-react/react-compiler-babel/rsbuild.config.ts	Updates Babel include/exclude to match templates; disables minify to support bundle inspection.
e2e/cases/plugin-react/react-compiler-babel/index.test.ts	Adds assertions to verify the hook was compiled in the build bundle.
e2e/cases/create-rsbuild/tools.test.ts	Adds coverage to ensure generated config contains the new include/exclude settings.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[gemini-code-assist]

Code Review

This pull request enhances the integration and testing of the React Compiler within Rsbuild. It refines Babel plugin configurations by broadening the include patterns and adding exclude rules for node_modules in both e2e tests and project templates. A new useCounter hook is introduced in an e2e test to provide a more complex scenario for the React Compiler, and new assertions are added to verify the presence of React Compiler artifacts in the bundled output. Additionally, minify: false is set in one test configuration, likely to aid in inspecting the compiler's output. A review comment suggests improving the robustness of a string search in an e2e test by using a regular expression to account for potential whitespace variations.