Module interfaces

[gustavopch]

Sometimes you need a lot of files to have the same structure, the same exports. For example, route files in Remix. All those files follow the contract defined by Remix, but there's currently no way in TypeScript to represent that contract, you need to manually type each export:

export loader: LoaderFunction = () => { ... }

export action: ActionFunction = () => { ... }

So the same way we can type an object and then TS knows exactly the shape it must have, we could have the same for the whole module:

module implements RouteModule<{ data: { foo: string } }>

export loader = () => { ... } // Inferred as LoaderFunction

export action = () => { ... } // Inferred as ActionFunction

We must read this issue to get insights: microsoft/TypeScript#38511