Find out how Flow and TypeScript compare and which is the best static checker for your next project.
What Is Flow?
What Is TypeScript?
To install Flow in your project, run the following command:
Next, you should install the Flow command line interface globally. This CLI provides several commands for building flow applications.
On macOS, use Homebrew to install Flow CLI:
brew install flow-cli
You will need to know how to use Windows PowerShell to install Flow on a Windows machine.
To install Flow CLI on Windows, run this script in your PowerShell terminal:
iex "& $(irm '<https://storage.googleapis.com/flow-cli/install.ps1>') "
Flow projects require a .flowconfig file for all necessary configurations of the tool.
Run this command to create a Flow configuration file in a new or existing project:
npm run flow init
Be aware that specific frameworks may ship projects with a Flow config file by default.
The last thing to do is add the Flow script to your package.json file:
Setting Up TypeScript in Your Project
Run the following command to install TypeScript in your project:
npm install typescript
Install the TypeScript compiler globally with this command:
npm install -g typescript
To initialize a tsconfig.json config file, enter the following command into your terminal:
The above instructions will get you started using TypeScript in your project.
Building With Flow
You can set variable and function data types using annotation. Flow will then raise an error if the anticipated type is not met.
let foo : number = "Hello";
Flow will throw an error here because the expected value type of foo is a number, not a string.
Run npm run flow to see the error output in the terminal:
Enabling the Flow extension inside any text editor of choice will show the errors in your editor as you code.
Flow also uses type inference to determine what the expected value of an expression should be.
return value * "hello";
let result = doSomething(6);
You cannot execute arithmetic operations between the number six and the string hello.
The output of npm run flow will be an error:
Developing With TypeScript
TypeScript’s type syntax is very similar to Flow’s. You can define variable and function types with type annotation just as you would in Flow.
TypeScript ships with several other features similar to Flow, like type inference.
Take the example TypeScript code:
type Result = "pass" | "fail"
function verify(result: Result)
if (result === "pass")
if (result === "pass")
Pros and Cons of TypeScript and Flow
This widespread adoption and large community result in better learning resources, updates, and tool support.
Flow acts as a type checker that works to warn you about potentially bad code. TypeScript prevents you from writing bad code and has a strict type system. TypeScript also supports object encapsulation, which helps keep complex code manageable. Flow does not have this feature.
Flow can work down to your project’s imported modules and libraries and discern how they affect your code. For example, it can detect and throw a warning when a required library in your project is missing or when you try to access a definition that does not exist.
Which Static Checker Should You Use?
There are many valid arguments for using each tool because each has different features. Some may be of top priority to one developer and low priority to the other. Both tools work well in their own respects and offer advantages for using them.
You should examine the requirements of your project and make an educated decision based on them.