How to avoid duplicate type definitions in module declarations?

Question

Disclaimer: I am still somewhat new to the flow and static typing in general, so it is very possible that I will miss something simple / obvious with this question.

Let's say I have a library called my-library . The library provides one module to its users index.js , which imports a couple of other modules ( moduleA.js and moduleB.js ) for internal use.

I want to use Flow with this library, both for my own development, and in the index.js.flow file with a module declaration for library users who also use Flow. Thus, the file structure will look something like this:

 - index.js - index.js.flow (contains the module declaration for library users) - moduleA.js - moduleA.js.flow (just exported type definitions, no module declaration) - moduleB.js - moduleB.js.flow (just exported type definitions, no module declaration) 

The problem is that the module declaration index.js.flow should use types from moduleA.js.flow and moduleB.js.flow . (The reason I have moduleA.js.flow and moduleB.js.flow and not just type definition directly in .js files is because type definitions in .js files will be deleted by Babel, and I want so that they still exist somewhere for library users).

I know that the following does not install validation with external JS, which imports my-module :

index.js.flow (this does not work)

 import type { SomeType } from './moduleA' declare module 'my-module' { declare function exports(): { someMethod: () => SomeType } } 

SomeType, apparently, cannot be used in the module declaration when importing it, but the local definition of its operation:

index.js.flow (this works)

 export type SomeType = string declare module 'my-module' { declare function exports(): { someMethod: () => SomeType } } 

So, one solution is to simply define and export all types from index.js.flow and just have moduleA.js and moduleB.js import them (and not include .js.flow files for moduleA and moduleB ), but it seems it is strange to have all type definitions in the root file of the stream, and not in the .js.flow files corresponding to the modules from which these types originate.

Alternatively, I know that I can define types in my respective development modules and simply define them again in the index.js.flow module index.js.flow , but I would prefer not to repeat the type definitions in two different places, if possible.

I would really appreciate any help in figuring out how best to organize this. (And again, I know there’s a pretty solid chance that I’m doing something dumb or forgetting something obvious.)

Answer 1

The purpose of .js.flow files is to act exactly like the corresponding .js files in your implementation, except that they are not translated by Babel. In particular, they import and export things in the same way as the corresponding .js files. In addition, like a .js file, it is automatically associated with a module based on where it is located in the file system, so this is a .js.flow file.

Following the example in the question, let's say index.js module.exports is a function that returns an object containing the someMethod property of type () => SomeType , where SomeType exported by moduleA.js . Then we can have the following in index.js.flow :

 // @flow import type { SomeType } from './moduleA' declare module.exports: () => { someMethod: () => SomeType; }; 

And the following in moduleA.js.flow :

 // @flow export type SomeType = string; 

Assuming we put index.js.flow and moduleA.js.flow in src/node_modules/my-module/ , we can verify that our installation is correct by having the test.js in test.js in src/ :

 // @flow var foo = require('my-module'); (foo().someMethod(): number); // error (string incompatible with number)