介绍#

💡 什么是 Rsbuild？#

• Rsbuild 是一个基于 Rspack 的 web 构建工具。
• Rsbuild 是一个增强版的 Rspack CLI，更易用、更开箱即用。
• Rsbuild 是 Rspack 团队对于 web 构建最佳实践的探索和实现。
• Rsbuild 是 Webpack 应用迁移到 Rspack 的最佳方案，减少 90% 配置，构建快 10 倍。

🚀 性能#

Rsbuild 的构建性能与原生 Rspack 处于同一水平。由于 Rsbuild 内置了更多开箱即用的功能，因此性能数据会略微低于 Rspack。

以下是构建 1000 个 React 组件的时间：

以上数据基于 Farm 团队搭建的 benchmark，更多信息请参考 performance-compare。

🔥 特性#

Rsbuild 具备以下特性：

• 易于配置：Rsbuild 的目标之一，是为 Rspack 用户提供开箱即用的构建能力，使开发者能够在零配置的情况下开发 web 项目。同时，Rsbuild 提供一套语义化的构建配置，以降低 Rspack 配置的学习成本。

• 性能优先：Rsbuild 集成了社区中基于 Rust 的高性能工具，包括 Rspack 和 SWC，以提供一流的构建速度和开发体验。与基于 Webpack 的 Create React App 和 Vue CLI 等工具相比，Rsbuild 提供了 5 ~ 10 倍的构建性能，以及更轻量的依赖体积。

• 插件生态：Rsbuild 内置一个轻量级的插件系统，提供一系列高质量的官方插件。此外，Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件，这意味着你可以在 Rsbuild 中使用社区或公司内沉淀的现有插件，而不需要重写相关代码。

• 产物稳定：Rsbuild 设计时充分考虑了构建产物的稳定性，它的开发环境产物和生产构建产物具备较高的一致性，并自动完成语法降级和 polyfill 注入。Rsbuild 也提供插件来进行类型检查和产物语法检查，以避免线上代码的质量问题和兼容性问题。

• 框架无关：Rsbuild 不与前端 UI 框架耦合，并通过插件来支持 React、Vue 3、Vue 2、Svelte、Solid、Lit 等框架，未来也计划支持社区中更多的 UI 框架。

🎯 定位#

除了作为一个构建工具使用，Rsbuild 也为上层的解决方案提供通用的构建能力，比如 Rspress 和 Modern.js，使他们能够专注于开发自己领域特定的能力。

下图说明了 Rsbuild 与生态中其他工具之间的关系：

🦀 生态#

• Rspack：基于 Rust 的高性能打包工具。
• Rspress：基于 Rsbuild 的静态站点生成器。
• Rsdoctor：针对 Rspack 和 Webpack 的一站式构建分析工具。
• Modern.js：基于 Rsbuild 的渐进式 React 框架。
• awesome-rspack：与 Rspack 和 Rsbuild 相关的精彩内容列表。

🧑‍💻 社区#

欢迎加入我们的 Discord 交流频道！Rspack / Rsbuild 团队和用户都在那里活跃，并且我们一直期待着各种贡献。

你也可以加入 飞书群 与大家一起交流。

✨ 下一步#

你可能想要：