logo标签列表

create-react-app能够与TypeScript一起使用吗？

reactjstypescriptcreate-react-app
48

我能否使用 TypeScript 和 create-react-app 一起使用？如果可以，应该如何操作？

什么会阻止你这样做？ - WilomGfx
我认为这是可能的（https://github.com/wmonk/create-react-app-typescript），但我个人不会将JavaScript用于除操作客户端浏览器DOM之外的任何其他事情。 - bjoster
1
@WilomGfx 对于“有什么会阻止你这样做”的回应：过去我会在webpack.config.js中添加一些条目，告诉webpack在构建过程中编译typescript。但是，使用create-react-app时，webpack是隐藏的。没有地方可以配置。 - Dave Ford
你需要运行弹出脚本。 - WilomGfx
7个回答
50
10
这似乎现在已经得到微软的官方支持：https://github.com/Microsoft/TypeScript-React-Starter。 - bfncs
@bfncs 我建议你小心，这个仓库似乎没有得到很好的维护（这也反映在了开放问题中）。 - Alexander Derck
1
请查看Martin最新的回答，因为CRA现在直接支持ts。 - Robert Parcus
20

这就是正确的方法：

# update create-react-app first
npm update -g create-react-app 
create-react-app my-app --typescript

Create React App v2.1.0 现在支持 TypeScript，因此您无需弹出或使用 react-scripts-ts 分支；

或者您可以将 TypeScript 添加到现有应用程序中：

yarn add typescript @types/node @types/react @types/react-dom @types/jest
# or
npm install --save typescript @types/node @types/react @types/react-dom @types/jest

然后将 .js 文件重命名为 .tsx 文件，以开始使用 TypeScript。

请注意，当您运行应用程序时，将为您创建一个 tsconfig.json 文件。您将能够编辑 tsconfig.json，但不能编辑一些选项。

鸣谢:

[1] Vincent 的回答

[2] 迁移 create react app 到 TypeScript 的文章

7

现在，在create-react-app的2.1版本中，Typescript已经可以直接使用了！

你可以像这样使用它（如此演示）: npx create-react-app@next app-name --scripts-version=2.0.6-next.c662dfb0 --typescript

1
它将在v2.1中发布 https://github.com/facebook/create-react-app/milestone/57 - Hullah
尝试运行以下命令以创建一个React应用：npx create-react-app@next app-name --scripts-version=2.0.6-next.c662dfb0 --typescript-- 这是来自此PR的评论：https://github.com/facebook/create-react-app/pull/5550 - Peter W
请注意，在2.1完全发布之前，我们不建议您开始使用beta版。仍会有重大更改。 - Joe Haddad
1
更新：2.1 版本已经发布！https://github.com/facebook/create-react-app/releases。所以这个命令应该可以运行：`npx create-react-app@2.1 app-name --typescript`。 - Peter W
3

这里是关于 create-react-app 的更新，涉及到 --typescript 标志

以前，为了使用 create-react-app 生成新的 TypeScript 项目，我们需要像下面这样使用 --typescript 标志：

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

但是根据create-react-app --help中的说明，下一个重大版本发布后，这个 typescript 标志将被移除。

  --typescript (this option will be removed in favor of templates in the next major release of create-react-app)
所以新的解决方案是使用模板，如此处所述：这里 例子：
npx create-react-app my-app --template typescript
这是同样的答案的视频格式 [使用 TypeScript 创建 React 应用程序] (https://www.youtube.com/watch?v=MWpmPP4z8HE)。 - InfiniteStack
2
你可以使用 Facebook 官方的 Typescript 模板 来创建 React 应用程序。
请执行。
npx create-react-app my-app --template typescript

或者

yarn create react-app my-app --template typescript
2
我在create-react-app的github issues中发布了一个功能请求，这是回复：

你好！我们还没有准备好考虑TypeScript（请参见＃142以获取更新）。我们还没有完成Flow集成（我们将建议首选类型安全性）。

此外，目前正在进行真正有趣的事情。请参见babel/babylon＃320和babel/babylon＃444。 TypeScript可能很快就会被Babylon解析（并由Babel编译）。微软对看到这种情况很感兴趣，并且也在自己的WIP上工作。

这个考虑可能还需要几个月的时间。抱歉！

尽管我们不赞成，但是有一个支持TypeScript的CRA分支。如果它对您没有用，我们无法提供支持，但它应该可以！

我不确定如何与levito的回复相一致。

这是github问题的链接：

https://github.com/facebookincubator/create-react-app/issues/1998#issuecomment-295311100

1
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接