MENU


Flow

Alexa's Ranking: 211,554

In many ways, with its identical type-checking syntax, Flow is similar to TypeScript.

To install Flow:


> npm init -y> npm install --save-dev flow-bin> npm install --save-dev flow-remove-types

Add to package.json:


"scripts": {"flow": "flow","build": "flow-remove-types -d lib/ src/" }

Then initialize flow:


> npm run flow init

Let's test it out. First create a flow file:

Flow files have the same .js extension as JavaScript. The comment /*@flow*/ designates the file as a Flow file to be checked.
/*@flow*/var obj : {a : string, b : number, c: Array<string>, d : Date} = {
  a : "hello",
  b : 42,
  c : ["hello", "world"],
  d : new Date()}function foo(x, y){
  return x + y;}foo('Hello', 42);class MyClass {
  static constant: number;
  static helper: (number) => number;
  method: number => number;}class MyClass2<A, B, C> {
  property: A;
  method(val: B): null {
    return null;
  }}

Then start the Flow server, which checks for changes in .js files in the current directory and its subdirectories. These files have /*@flow@/ designated at the top:


> npm run flow

To stop the server:


> npm run flow stop

To strip the type annotations from these Flow .js files:


> npm run build

This compiles all the source Flow files in src/ (including those without the /*@flow*/ designation) to lib/:


/*
     */var obj = {
  a : "hello",
  b : 42,
  c : ["hello", "world"],
  d : new Date()}function foo(x, y){
  return x + y;}foo('Hello', 42);class MyClass {
  static constant;
  static helper;
  method;}class MyClass2{
  property;
  method(val){
    return null;
  }}