Bringing Flow into the development server

Wouldn't it be great if type-checking your React code were more tightly-integrated into the create-react-app development process? There's been talk of making this a reality in a future release of create-react-app. For now, you'll have to eject from create-react-app if you want this functionality for your project.

The goal of this approach is to have the development server run Flow for you whenever changes are detected. Then, you can see the Flow output in your dev server console output, and in the browser console.

Once you've ejected from create-react-app by running npm eject, you need to install the following Webpack plugin:

npm install flow-babel-webpack-plugin --save-dev

Then, you need to enable the plugin by editing config/webpack.config.dev.js. First, you need to include the plugin:

const FlowBabelWebpackPlugin = require('flow-babel-webpack-plugin');

Then, you need to add the plugin to the array in the plugins option. This array should look something...