Mas Bagol Mas Bagol - 3 months ago 34
Javascript Question

How to declare React.Component type from external module with separate declaration file?

Say, there is an external module that exported a React Component. That module doesn't have flow declaration. I want to declare it to enable flow type checking.

For example, that module is defined like this:

import React from 'react'

class External extends React.Component {
static propTypes = {
name: React.PropTypes.string.isRequired
}
render() {
return <div></div>
}
}


If I wrote that my self (internal module) Flowtype will be able to detect missing
props. But, since that
External
component is exported from external module.
Flow doesn't do type checking. So, I need to create separate type declaration
for that module.

I tried this:

// ./interfaces/the-external-module.js.flow

declare module "the-external-module" {
declare export var External: React.Component;
}


Of course it doesn't work because React is not within scope. So, how can I
declare that
External
as
React.Component
in separate type declaration file?

Answer

According to some of the official definitions, use React$Component (defined in the source here); e.g.

declare module "the-external-module" {
  declare export var External: React$Component;
}
Comments