如何将流类型添加到弹出的 create-react-app？答案

【问题标题】：How to add flowtype to an ejected create-react-app?如何将流类型添加到弹出的 create-react-app？
【发布时间】：2018-09-09 03:24:12
【问题描述】：

我们正在处理之前弹出的create-react-app，现在想要添加流类型。

我们已按照以下指南操作：https://flow.org/en/docs/tools/create-react-app/

这应该适用于被弹出的应用程序吗？

不幸的是，这导致使用 yarn start 启动的 webpack-dev 服务器停止在文件更新时自动重新加载。

此外，将// @flow 添加到某些文件后，没有输出或指示流强制类型检查。

我们是否需要手动更新 webpack 配置？

这是package.json 脚本

  "scripts": {
    "start": "node scripts/start.js",
    "build": "yarn build-client && yarn build-server",
    "build-client": "node scripts/build.js",
    "build-server": "./node_modules/.bin/webpack --config ./config/webpack.server.config.js",
    "test": "node scripts/test.js --env=jsdom",
  },

运行yarn start 的输出是：

Compiled successfully!

You can now view cra in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://192.168.1.65:3000/

Note that the development build is not optimized.
To create a production build, use yarn build.

【问题讨论】：

没有输出？还是没有错误？你能发布你的配置和运行流程的输出吗？
@DaveMeehan 所说的“运行流的输出”是指yarn start 或node scripts/start.js 的输出？
无论您使用什么方法来运行流二进制文件。如果您不确定，请发布您的 package.json（脚本部分）
@DaveMeehan 添加脚本并输出示例
您还没有设置流程，也没有修改您的测试脚本来运行流程。 yarn start 正在运行服务器，而不是测试。 test 脚本需要修改以调用流（"test": "flow"，加上任何其他需要的选项，通常没有）。检查其他步骤的流程设置说明，然后运行yarn test。

标签： reactjs webpack flowtype yarnpkg

【解决方案1】：

您链接的文档告诉您如何安装 flow-bin 并制作配置文件，但没有告诉您如何启动它。
Flow 是独立的工具，应该通过自己的命令启动（取决于你想如何运行它）：

如果你想手动检查类型检查，你需要在你的package.js的“脚本”部分添加npm命令："example-comand-flow": "flow"。然后通过npm run example-comand-flow 调用它，你会直接在运行脚本的终端上得到错误。
如果你想继续进行类型检查，你应该找到一本手册如何在你的 IDE 中配置它。例如，在 WebStorm 中，您应该转到 Preferences -> Languages & Frameworks -> JavaScript 并将 JavaScript language version 设置为 Flow 并指定流可执行文件。

【讨论】：