Stack Overflow
Stack Overflow

Questions tagged [flowtype]

Flow is a static type checker, designed to find type errors in JavaScript programs, created by Facebook.

What is Flow?

Flow is a static type checker, designed to find type errors in JavaScript programs.

The goal of Flow is to find errors in JavaScript code with little programmer effort. Flow relies heavily on type inference to find type errors even when the program has not been annotated - it precisely tracks the types of variables as they flow through the program.

At the same time, Flow is a gradual type system. Any parts of your program that are dynamic in nature can easily bypass the type checker, so you can mix statically typed code with dynamic code.

Flow also supports a highly expressive type language. Flow types can express much more fine-grained distinctions than traditional type systems. For example, Flow helps you catch errors involving null, unlike most type systems.

2301 questions
19
votes
4 answers

How to use Flow with React.createRef()?

Since React 16.3 it is possible to use React.createRef() to access a DOM element. I am also using Flow in my project, but the documentation still uses the old way. The below code unfortunately fails: /* @flow */ import * as React from…
Zardoz
  • 14,339
  • 21
  • 79
  • 126
19
votes
1 answer

Flow type for optional field in an object

In the following code (Try Flow): type Response = { err: ?string; data: Object; } function length(x): Response { return { data : {} }; } length(10) I made err optional, but still get an error: Property err not found in object literal
bsr
  • 52,180
  • 78
  • 198
  • 296
19
votes
4 answers

How do you export a Flow type definition that is imported from another file?

Given a type definition that is imported from another module, how do you re-export it? /** * @flow */ import type * as ExampleType from './ExampleType'; ... // What is the syntax for exporting the type? // export { ExampleType };
ide
  • 17,118
  • 4
  • 56
  • 101
18
votes
1 answer

Ignoring node_modules when using flow

I am using flow within my React Native application, the initial startup of flow is incredibly slow because it is traversing through my node_modules directory. Flow is reporting masses of errors coming from these third party libraries, which I am…
Dan
  • 4,211
  • 4
  • 29
  • 55
18
votes
1 answer

How can I type a default export using Flow?

How can I type a default export using Flow? Does Flow have a way of accomplishing this? Desired Outcome: // index.js type complexThing = { a: string } type Thing = { x: number, y: boolean, z: complexThing } export default { x: 0, y:…
Joseph Fraley
  • 1,210
  • 1
  • 9
  • 22
18
votes
1 answer

ES6 Map in Flowtype

What is the appropriate way to deal with ecmascript-6 Map objects in flowtype? const animals:Map = new Map(); function feedAnimal(cageNumber:number) { const animal:Animal = animals.get(cageNumber); ... } Error const…
mate64
  • 8,500
  • 15
  • 58
  • 93
18
votes
2 answers

Proper Flow type for React render method?

I'm curious what the proper Flow annotation is for both render methods in React classes, and simple returns in stateless functions: const UserProfilePage = () => { return
…
ffxsam
  • 20,847
  • 29
  • 72
  • 128
16
votes
3 answers

How to do flow type annotations for React hooks (useState, etc.)?

How should we be using Flow type annotations with react hooks, such as useState? I've tried searching for some examples of how they should be implemented, but can't find anything. I tried this: const [allResultsVisible, setAllResultsVisible]: […
timothym
  • 1,504
  • 3
  • 14
  • 25
16
votes
2 answers

Is there a point to doing 'import type' rather than 'import' with Flow?

Flow allows you to use the following syntax to import types: // SomeClass.js export default class SomeClass {} // SomeFile.js import type SomeClass from './SomeClass'; What's the benefit of using import type instead of import? Does it tell Flow…
James Ko
  • 25,479
  • 23
  • 92
  • 196
16
votes
1 answer

How do I generate .d.ts typings from Flow code?

I have enabled Flow on a JavaScript project I am developing. Since I am putting in the effort to providing type annotations, I would really like to generate *.d.ts files so the broader TypeScript community can also have type information. How can I…
vossad01
  • 10,262
  • 7
  • 50
  • 102
16
votes
1 answer

Flow interfaces versus object type aliases

What is the difference between these Flow type definitions? interface Vehicle { start(): void, stop(): void } type Vehicle = { start(): void, stop(): void }; As far as I can tell, they can be used in the same way.
Mark Volkmann
  • 746
  • 9
  • 13
16
votes
5 answers

How to get Flow to properly work with Vue 2 (webpack)?

I'm trying to add Flow to the Vue 2 webpack-template. For the record, I'm on runtime-only (files follow the .vue format / standard). My first attempt was to use flow through the cli, which I realized it's not going to work because it didn't know how…
Dan Mindru
  • 5,261
  • 4
  • 26
  • 42
16
votes
2 answers

Flow type checker errors in node_modules/*

I've initialized flow project with flow init in fresh https://github.com/davezuko/react-redux-starter-kit project. When Flow does it check, it finds several errors in node_modules. Errors are happening in /* flow */ annotated library files. It…
Igor Loskutov
  • 1,200
  • 2
  • 12
  • 24
15
votes
5 answers

Plugin/Preset files are not allowed to export objects, only functions

I'm getting this error after updating react-native to "^0.56.0": bundling failed: Error: Plugin/Preset files are not allowed to export objects, only functions. In /Users/ben/vepo/frontend/node_modules/babel-preset-flow/lib/index.js I tried to do…
BeniaminoBaggins
  • 8,960
  • 28
  • 96
  • 208
15
votes
2 answers

Why Flow cannot call ReactDOM.render with document.getElementById(...)

I was getting this error below in Flow type checking. Cannot call ReactDOM.render with document.getElementById(...) bound to container because null [1] is incompatible with Element [2]. src/index.js 26│ 27│ …
sflow
  • 505
  • 2
  • 6
  • 15
1 2
3
…
99 100