编译库

本指南帮助库作者了解如何使用 React Compiler 为用户发布经过优化的库代码。

为什么要发布编译后的代码？

作为库作者，你可以在发布到 npm 之前先编译你的库代码。这带来几个好处：

将 React Compiler 添加到你的库构建流程中：

Terminal

npm install -D babel-plugin-react-compiler@latest

配置你的构建工具来编译你的库。例如，使用 Babel：

// babel.config.js
module.exports = {
  plugins: [
    'babel-plugin-react-compiler',
  ],
  // ... 其他配置
};

如果你的库支持 React 19 以下的版本，你将需要额外的配置：

我们建议将 react-compiler-runtime 作为直接依赖安装：

Terminal

npm install react-compiler-runtime@latest

{
  "dependencies": {
    "react-compiler-runtime": "^1.0.0"
  },
  "peerDependencies": {
    "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
  }
}

设置你的库所支持的最低 React 版本：

{
  target: '17', // 最低支持的 React 版本
}

分别在启用和未启用编译的情况下测试你的库，以确保兼容性。将你现有的测试套件运行在编译后的代码上，同时再创建一个绕过编译器的独立测试配置。这有助于发现编译过程中可能出现的任何问题，并确保你的库在所有场景下都能正常工作。

如果你编译后的库在 React 17 或 18 中抛出错误：

某些 Babel 插件可能与 React Compiler 冲突：

如果用户看到 “Cannot find module ‘react-compiler-runtime’”：