Static type checking with immutable.js and Facebook flow

Question

I've been using Immutable.js for my react app and I'm loving it. Facebook also released Flow. Flow would let me do very cool things like compile time validation of prop types. The problem is that my props are generally Immutable objects. Is there a good way to use Immutable.js and Flow together?

Given an Immutable.js object parameter can I use Flow to somehow specify the type of the object it should be wrapping? Within that object I might have strings, numbers, booleans, and more importantly other Immutable.js objects.

Maybe you can use accessors to statically annotate that dynamic part of the Immutable.js. — Rygu, Dec 10 '14 at 12:47
Do you mean wrap an immutable object with a custom object that provides annotated accessors? — Kilamanjaro Kablam, Dec 10 '14 at 17:34
@brandon-tilley I hesitated to use the flowtype tag because there is a completely unrelated project that has to do with typography called [FlowType.JS](http://simplefocus.com/flowtype/). — Kilamanjaro Kablam, Dec 11 '14 at 04:10
Flow more about JS types. You can use https://www.npmjs.com/package/react-immutable-proptypes for check prop types. It works for me. — Dmitry Manannikov, Jun 07 '15 at 20:30

score 6 · Answer 1 · answered May 18 '16 at 08:29

6

At the time of writing, you can use the two together by grabbing the interface file from here:

https://github.com/facebook/immutable-js/blob/master/type-definitions/immutable.js.flow

Create a directory within your project, for example interfaces.
Create a .flowconfig if it doesn't exist, and add the following lines

.flowconfig

[libs]
interfaces/

This will look in the ./interfaces/ directory for Flow definitions.

Although linking to a resource is frowned upon on SO, it that case it makes sense as that will be the most up to date (I'm assuming FB will keep it update as they update the core library)

answered May 18 '16 at 08:29

Chris

43,908
26
122
165

3

Would it be possible to get an example of it in use. What would the type for an immutable version of this look like? `type someObject = {fieldOne: string, fieldTwo: number};` – m14t Aug 19 '16 at 00:21
1

Not sure why the downvote? It is almost identical @Geoffrey Abdallah's answer, yet was answered prior to his? – Chris Aug 19 '16 at 10:24
Thanks for this great help. – JamesG Oct 18 '17 at 04:08

Geoffrey Abdallah · Answer 2 · 2016-08-10T16:05:43.983

3

Edited to add that flowtypes have been added since most recent major version.

Original answer:

Looks like integration between Flow and Immutable.js is in development but not yet complete.

edited Aug 10 '16 at 16:05

answered Jun 14 '15 at 07:18

Geoffrey Abdallah

3,009
12
25

Static type checking with immutable.js and Facebook flow

2 Answers2