添加 TypeScript

注意：此功能在 [email protected] 及更高版本中可用。

TypeScript 是 JavaScript 的类型化超集，它编译成纯 JavaScript。

安装

要使用 TypeScript 启动一个新的 Create React App 项目，你可以运行

npx create-react-app my-app --template typescript

或

yarn create react-app my-app --template typescript

如果你之前已经通过 npm install -g create-react-app 全局安装了 create-react-app，我们建议你使用 npm uninstall -g create-react-app 或 yarn global remove create-react-app 卸载该包，以确保 npx 始终使用最新版本。

不再支持 create-react-app 的全局安装。

要将 TypeScript 添加到现有的 Create React App 项目中，首先安装它

npm install --save typescript @types/node @types/react @types/react-dom @types/jest

或

yarn add typescript @types/node @types/react @types/react-dom @types/jest

接下来，将任何文件重命名为 TypeScript 文件（例如，将 src/index.js 重命名为 src/index.tsx），然后**重新启动开发服务器**！

类型错误将显示在与构建相同的控制台中。您必须在继续开发或构建项目之前修复这些类型错误。有关高级配置，请参阅此处。

TypeScript 和 React 入门

您不需要创建 tsconfig.json 文件，系统会为您创建一个。您可以编辑生成的 TypeScript 配置。

• TypeScript 手册
• React 上的 TypeScript 示例
• React + TypeScript 速查表 对如何使用 React 与 TypeScript 有很好的概述

故障排除

如果您的项目不是使用 TypeScript 启用的，则 npx 可能正在使用 create-react-app 的缓存版本。使用 npm uninstall -g create-react-app 或 yarn global remove create-react-app 删除先前安装的版本（请参阅 #6119）。

如果您当前正在使用 create-react-app-typescript，请参阅 这篇博文，了解如何迁移到 Create React App 的说明。

不支持常量枚举和命名空间，您可以了解有关 此处使用 Babel 与 TypeScript 的限制。