Are Flow Type annotations included in production code at runtime?

2
votes

I have a general question about Flow.

I currently use React's prop-types library to define component prop types. These checks are stripped out of production code, so it's still possible for data from external sources to cause a script to crash.

<Foo bar={i} />

Example: Let's say I have a component, Foo, that has a property of bar with a prop type of number. While I'm coding, I'll be notified if I try to accidently pass a string to Foo's bar prop. However, once the code goes live, that sanity check is removed.

Does Flow stay in production code? By that I mean, continuing the above example, if I used Flow, would Flow throw an error at runtime if someone tried to pass in a string to Foo's bar property?

1
javascriptreactjsflowtypereact-proptypes
How are you getting external data into your application without having that data have types? Unless you've marked it any, Flow would still require you to validate the input types. - loganfsmyth

1 Answers

5
votes

Well, this all depends on your build tools. Neither Flow nor React will remove type annotations on their own.

One major difference between React prop types and Flow is that React prop types are dynamic while Flow is static. This means that Flow won't throw any run-time errors, it does the checks statically.

This means that Flow, by design, will be stripped out of any compiled code no matter the environment.

Here's a demo on how Babel compiles it.

If, for some reason, you wanted to remove Flow annotations from the development code itself, you can use one of the following:

Babel Plugin: Transform Flow Strip Types

CLI tool: Flow Remove Types

If you're looking for dynamic type-checking using Flow semantics, checkout flow-runtime.