跳至主内容

TypeScript 的一等公民支持

· 1 分钟阅读
Luna Wei
Luna Wei
Software Engineer @ Meta
Nick Gerleman
Nick Gerleman
Software Engineer @ Meta
非官方测试版翻译

本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。 发现错误？ 报告问题 →

随着 0.71 版本的发布，React Native 通过以下改进全力提升 TypeScript 开发体验：

本文将解析这些变化对 TypeScript 或 Flow 用户的实际影响。

全新应用模板默认采用 TypeScript​

从 0.71 版本开始，通过 React Native CLI 创建新应用时将默认生成 TypeScript 项目！

npx react-native init My71App --version 0.71.0

展示 React Native CLI 生成新应用的 iPhone 模拟器截图。右侧 Visual Studio Code 编辑器打开 "App.tsx" 文件，证明其运行的是 TypeScript 文件。

新应用的入口文件将变为 App.tsx（取代原先的 App.js），并具备完整的 TypeScript 类型支持。项目已预置 tsconfig.json 配置，您的 IDE 将立即提供开箱即用的类型提示功能！

React Native 内置类型声明​

0.71 是首个内置 TypeScript (TS) 类型声明的版本。

此前，React Native 的 TypeScript 类型声明由托管在 DefinitelyTyped 仓库的 @types/react-native 提供。将 TypeScript 类型声明与 React Native 源码同仓库存储的决定，旨在提升准确性和可维护性。

@types/react-native 仅提供稳定版的类型声明。这意味着若要在 TypeScript 中使用 React Native 预发布版本，您只能沿用旧版类型声明（可能不准确）。@types/react-native 的发布流程也存在缺陷：其版本滞后于 React Native 正式发布，且需人工检查 React Native 公共 API 的类型变更并更新 TS 声明文件。

TS 类型声明与源码同仓库存储后，类型可见性和维护责任归属更加明确。我们团队正积极开发工具以确保 Flow 与 TS 的同步。

此项变更还减少了 React Native 用户需要管理的依赖项。升级至 0.71 或更高版本后，您可移除 @types/react-native 依赖。请参考新应用模板配置 TypeScript 支持。

我们计划在 0.73 及后续版本中弃用 @types/react-native，具体方案如下：

  • 仍会发布适配 React Native 0.71/0.72 的 @types/react-native 包，其内容与对应版本分支中的类型声明完全一致

  • 从 React Native 0.73 开始，TS 类型声明将仅通过 React Native 提供

迁移指南​

建议您尽快迁移至新的同仓库类型声明。以下按使用场景提供详细迁移说明：

应用维护者​

升级到 React Native ≥ 0.71 后，您可将 @types/react-native 从 devDependency 中移除

备注

如果收到警告提示某个依赖库将 @types/react-native 列为 peerDependency，请向该库提交 issue 或 PR 要求使用可选 peer 依赖，目前可暂时忽略该警告。

库维护者​

针对 React Native 0.71 以下版本的库可能将 @types/react-native 设为 peerDependency 以进行类型检查。该依赖应在 peerDependenciesMeta 中标记为可选，这样对于不使用 TypeScript 的用户或 0.71+ 版本（内置类型声明）的用户就不会强制要求安装。

依赖 @types/react-native 的类型声明维护者​

请查阅 0.71 版本引入的重大变更，确认是否已做好迁移准备。

使用 Flow 的用户会受影响吗？​

Flow 用户仍可对面向 0.71+ 版本的应用进行类型检查，但新模板不再默认包含 Flow 配置。

以往 Flow 用户升级 React Native 类型时，需要合并新模板的 .flowconfig 并手动更新 flow-bin。新模板虽已移除 .flowconfig，但 React Native 仓库仍保留参考配置可供应用借鉴。

如需新建基于 Flow 的 React Native 应用，可参考 0.70 版本的模板。

发现 TypeScript 声明文件存在缺陷怎么办？​

无论您使用的是内置 TS 类型还是 @types/react-native，若发现缺陷请同时向 React Native 和 DefinitelyTyped 仓库提交 PR。若无法自行修复，请在 React Native 仓库创建 GitHub issue 并标注 @lunaleaps。

文档优先支持 TypeScript​

为确保一致的 TypeScript 体验，我们已对 React Native 文档进行多项更新，将 TypeScript 确立为新的默认语言。

代码示例现已支持内联 TypeScript 语法，超过 170 个交互式示例已更新并通过新模板的代码规范检查。多数示例同时兼容 TypeScript 和 JavaScript，存在差异的示例均提供双语切换功能。

若发现文档错误或有改进建议，请记住网站本身也是开源的，我们非常欢迎您的 PR！

致谢 React Native TypeScript 社区！​

最后，我们要衷心感谢多年来社区为确保 React Native 开发者能够使用 TypeScript 所付出的努力。

特别鸣谢所有自 2015 年起维护 @types/react-native 的贡献者们！我们深知诸位为确保 React Native 用户获得最佳体验所倾注的心血。

感谢 @acoates、@eps1lon、@kelset、@tido64、@Titozzz 和 @ZihanChen-MSFT 的鼎力协助，正是你们在咨询探讨、沟通交流和审查修改中的贡献，才让 TypeScript 类型定义成功迁移至 React Native 代码库。

同时，我们要特别感谢 react-native-template-typescript 的维护者们，你们从最初就为 React Native 的新应用开发提供了出色的 TypeScript 支持体验。

我们期待在 React Native 代码库中开展更直接的合作，持续提升 React Native 的开发体验！