feat: add support for flow in babel (#77)

Detects whether `flow-bin` is a dependency on the project, if so it will load the `@babel/preset-flow`-module.

**What**:

In `babelrc.js` we should check if `flow-bin` is a dependency and then load the `@babel/preset-flow`

**Why**:
We have copied the same away `react` is being detected by using `ifAnyDep`-utility

**How**:

Small change to `babelrc.js`

**Checklist**:

- [X] Documentation
- [ ] Tests
- [X] Ready to be merged
- [ ] Added myself to contributors table

<!-- feel free to add additional comments -->

Author: weyert

README.md

@@ -38,6 +38,7 @@ for linting, testing, building, and more.
 - [Installation](#installation)
 - [Usage](#usage)
   - [Overriding Config](#overriding-config)
+  - [Flow support](#flow-support)
 - [Inspiration](#inspiration)
 - [Other Solutions](#other-solutions)
 - [Contributors](#contributors)
@@ -111,6 +112,10 @@ module.exports = Object.assign(jestConfig, {
 > configuring things to make it less magical and more straightforward. Extending
 > can take place on your terms. I think this is actually a great way to do this.
 
+### Flow support
+
+If the `flow-bin` is a dependency on the project the `@babel/preset-flow` will automatically get loaded when you use the default babel config that comes with `kcd-scripts`. If you customised your `.babelrc`-file you might need to manually add `@babel/preset-flow` to the `presets`-section.
+
 ## Inspiration
 
 This is inspired by `react-scripts`.

package.json

@@ -42,6 +42,7 @@
     "@babel/plugin-transform-runtime": "^7.2.0",
     "@babel/preset-env": "^7.2.0",
     "@babel/preset-react": "^7.0.0",
+    "@babel/preset-flow": "^7.0.0",
     "@babel/runtime": "^7.2.0",
     "all-contributors-cli": "^5.4.1",
     "arrify": "^1.0.1",

src/config/babelrc.js

@@ -13,8 +13,11 @@ const isWebpack = parseEnv('BUILD_WEBPACK', false)
 const treeshake = parseEnv('BUILD_TREESHAKE', isRollup || isWebpack)
 const alias = parseEnv('BUILD_ALIAS', isPreact ? {react: 'preact'} : null)
 
-const hasBabelRuntimeDep = Boolean(pkg.dependencies && pkg.dependencies['@babel/runtime'])
-const RUNTIME_HELPERS_WARN = 'You should add @babel/runtime as dependency to your package. It will allow reusing so-called babel helpers from npm rather than bundling their copies into your files.'
+const hasBabelRuntimeDep = Boolean(
+  pkg.dependencies && pkg.dependencies['@babel/runtime'],
+)
+const RUNTIME_HELPERS_WARN =
+  'You should add @babel/runtime as dependency to your package. It will allow reusing so-called babel helpers from npm rather than bundling their copies into your files.'
 
 if (!treeshake && !hasBabelRuntimeDep) {
   throw new Error(RUNTIME_HELPERS_WARN)
@@ -35,8 +38,8 @@ const browsersConfig = browserslist.loadConfig({path: appDirectory}) || [
 const envTargets = isTest
   ? {node: 'current'}
   : isWebpack || isRollup
-    ? {browsers: browsersConfig}
-    : {node: getNodeVersion(pkg)}
+  ? {browsers: browsersConfig}
+  : {node: getNodeVersion(pkg)}
 const envOptions = {modules: false, loose: true, targets: envTargets}
 
 module.exports = () => ({
@@ -49,9 +52,13 @@ module.exports = () => ({
         {pragma: isPreact ? 'React.h' : undefined},
       ],
     ),
+    ifAnyDep(['flow-bin'], [require.resolve('@babel/preset-flow')]),
   ].filter(Boolean),
   plugins: [
-    [require.resolve('@babel/plugin-transform-runtime'), { useESModules: treeshake && !isCJS }],
+    [
+      require.resolve('@babel/plugin-transform-runtime'),
+      {useESModules: treeshake && !isCJS},
+    ],
     require.resolve('babel-plugin-macros'),
     alias
       ? [