开启调试模式

为了便于排查问题，Rsbuild 提供了调试模式，你可以在执行构建时添加 DEBUG=rsbuild 环境变量来开启 Rsbuild 的调试模式。

  1. # 调试开发模式
  2. DEBUG=rsbuild pnpm dev
  4. # 调试生产模式
  5. DEBUG=rsbuild pnpm build

在调试模式下，Rsbuild 会输出一些额外的日志信息，并将内部最终生成的 Rsbuild 配置和 Rspack 配置写入到产物目录下，便于开发者查看和调试。

日志信息

在调试模式下，你会看到 terminal 中输出了一些以 rsbuild 开头的日志，包括 Rsbuild 内部执行的操作、当前使用的 Rspack 版本等。

  1. $ DEBUG=rsbuild pnpm dev
  3.   ...
  4.   rsbuild init plugins
  5.   rsbuild init plugins done
  6.   rsbuild Use Rspack v1.0.0
  7.   ...

此外，terminal 中还会输出以下日志，表示 Rsbuild 将内部生成的构建配置写入到磁盘中，此时你可以打开这些配置文件来查看相应的内容。

  1. Inspect config succeed, open following files to view the content:
  3.   - Rsbuild Config: /Project/demo/dist/.rsbuild/rsbuild.config.mjs
  4.   - Rspack Config (web): /Project/demo/dist/.rsbuild/rspack.config.web.mjs

Rsbuild 配置文件

在调试模式下，Rsbuild 会自动生成 dist/.rsbuild/rsbuild.config.mjs 文件，这里面包含了最终生成的 Rsbuild 配置。在这个文件里，你可以了解到你传入的 Rsbuild 配置在经过框架层和 Rsbuild 处理后的最终结果。

该文件的大致结构如下：

rsbuild.config.mjs

  1. export default {
  2.   dev: {
  3.     // some configs...
  4.   },
  5.   source: {
  6.     // some configs...
  7.   },
  8.   // other configs...
  9. };

关于 Rsbuild 配置项的完整介绍，请查看 配置 Rsbuild 章节。

Rspack 配置文件

在调试模式下，Rsbuild 还会自动生成 dist/.rsbuild/rspack.config.web.mjs 文件，这里面包含了最终生成的 Rspack 配置。在这个文件里，你可以了解到 Rsbuild 最终传递给 Rspack 的配置里包含了哪些内容。

该文件的大致结构如下：

rspack.config.web.mjs

  1. export default {
  2.   resolve: {
  3.     // some resolve configs...
  4.   },
  5.   module: {
  6.     // some Rspack loaders...
  7.   },
  8.   plugins: [
  9.     // some Rspack plugins...
  10.   ],
  11.   // other configs...
  12. };

关于 Rspack 配置项的完整介绍，请查看 Rspack 官方文档。