babel: babel-preset-react includes Flow, which conflicts with babel-preset-typescript.

When trying out babel-preset-typescript with babel-preset-react, I learned that the React preset comes bundled with Flow. This hasn’t caused any problems in Babel <7, as Flow doesn’t conflict with anything else.

With Babel 7 and the Typescript preset, the current experience is to see an error about the conflict between Flow and Typescript, then search the documentation for each of the presets used, figure out which one is including Flow, and replace it with the three React plugins.

{
  plugins: [
    "syntax-jsx",
    "transform-react-jsx",
    "transform-react-display-name"
  ],
  presets: ["typescript"],
}

My question is: should Flow still be bundled in this preset? Or, should the error message describe what is causing Flow to be included? It’s strange to have a type system unrelated to React to be included in the React preset. This was a quick fix for me, but the “me” from one year ago may have spent hours trying to figure out why Typescript and React together result in an error.

Babel Configuration (.babelrc, package.json, cli command)

{
  presets: [
    "typescript",
    "react"
  ]
}

Current Behavior

Error: “Cannot combine flow and typescript plugins”.

Possible Solution

Include extra information in error message (flow is included in babel-preset-react, use React plugins instead) Remove preset-flow from babel-preset-react in v7.

Your Environment

software version(s)
Babel 7.0.0-alpha.19
node 8.1.4
npm 5.0.3
Operating System Windows 10

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 4
  • Comments: 19 (15 by maintainers)

Most upvoted comments

Just created two prs with the solutions discussed until now:

  • Remove Flow support in React preset #6118
  • Add noFlow option to React preset #6119