From 2b2b8ff33842e18be18834bef563e47b00617ad9 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Sun, 11 Dec 2016 10:08:37 -0800 Subject: [PATCH] Replace the Flow documentation section (#1245) --- packages/react-scripts/template/README.md | 27 +++++++++-------------- 1 file changed, 10 insertions(+), 17 deletions(-) diff --git a/packages/react-scripts/template/README.md b/packages/react-scripts/template/README.md index bdb88df6023..cc67c65a8c4 100644 --- a/packages/react-scripts/template/README.md +++ b/packages/react-scripts/template/README.md @@ -444,28 +444,21 @@ Now you are ready to use the imported React Bootstrap components within your com ## Adding Flow -Flow typing is currently [not supported out of the box](https://github.com/facebookincubator/create-react-app/issues/72) with the default `.flowconfig` generated by Flow. If you run it, you might get errors like this: +Flow is a static type checker that helps you write code with fewer bugs. Check out this [introduction to using static types in JavaScript](https://medium.com/@preethikasireddy/why-use-static-types-in-javascript-part-1-8382da1e0adb) if you are new to this concept. -```js -node_modules/fbjs/lib/Deferred.js.flow:60 - 60: Promise.prototype.done.apply(this._promise, arguments); - ^^^^ property `done`. Property not found in -495: declare class Promise<+R> { - ^ Promise. See lib: /private/tmp/flow/flowlib_34952d31/core.js:495 +Recent versions of [Flow](http://flowtype.org/) work with Create React App projects out of the box. -node_modules/fbjs/lib/shallowEqual.js.flow:29 - 29: return x !== 0 || 1 / (x: $FlowIssue) === 1 / (y: $FlowIssue); - ^^^^^^^^^^ identifier `$FlowIssue`. Could not resolve name -``` +To add Flow to a Create React App project, follow these steps: -To fix this, change your `.flowconfig` to look like this: +1. Run `npm install --save-dev flow-bin`. +2. Add `"flow": "flow"` to the `scripts` section of your `package.json`. +3. Add `// @flow` to any files you want to type check (for example, to `src/App.js`). -```ini -[ignore] -/node_modules/fbjs/.* -``` +Now you can run `npm run flow` to check the files for type errors. +You can optionally use an IDE like [Nuclide](https://nuclide.io/docs/languages/flow/) for a better integrated experience. +In the future we plan to integrate it into Create React App even more closely. -Re-run flow, and you shouldn’t get any extra issues. +To learn more about Flow, check out [its documentation](https://flowtype.org/). ## Adding Custom Environment Variables