如何在Typescript中使用React Native？

Question

我已经阅读到React Native支持Typescript，而没有像 react-native-typescript-transformer 这样的依赖项。如何将其配置为使用 Typescript 进行编码？

Answer 1

从0.57.0起

通过升级到Babel v7，支持Typescript，但是您仍然需要对应用程序进行一些更改：

• 安装类型定义依赖项@types/jest @types/react @types/react-native @types/react-test-renderer
• 根据此类文件是否包含JSX，将.js文件更改为.ts或.tsx。 注意：保持index.js不变，否则Metro生成器将失败，因为它仍未更新以期望有一个.ts条目文件。
• 您将需要为Typescript的图像，视频和json文件等二进制资产添加模块声明，以了解如何导入它们（示例here）。

• 要进行测试，必须在package.json的配置部分中添加以下内容，以使Jest了解Typescript：

  "jest": {
    "preset": "react-native",
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js"
    ],
    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$"
  }
  

请注意，Babel通过此设置仅将Typescript转换为Javascript，而不执行类型检查。

此外，由于它是第一个支持Typescript的React Native版本，因此可能会出现问题。我的建议是仍然按照以下说明进行操作，直到时间和补丁使事情稳定下来。

0.57.0之前

React Native不提供第一方Typescript支持。相反，如果您想要类型而不必添加其他依赖项（当然不是flow-bin的话），它提供了Flow开箱即用的支持。

如果您一定要使用Typescript，则需要根据最终选择使用的设置，以一种或另一种方式添加一些依赖项。有一个React Native博客文章 Using Typescript with React Native 解释了添加Typescript的一种方法。