ESLint reports no-undef error on flow-typed global types

Question

I have global types defined in /flow-typed/redux.flow.js :

declare type Action = {|
  +type: string,
  +payload: any,
|}

declare type State = {|
  +ui: UI,
  +user: User,
  +team: Team,
  +projects: Project[],
  +profile: Profile,
|}

declare type UI = {|
  +isSliderOpen: boolean,
  +isModalVisible: boolean,
  +modalAction: string,
  +modalPayload: Object,
|}

...

I have added airbnb eslint configuration to my project and now I get:

type Props = {
  logout: () => Action, //error ESLint 'Action' is not defined.(no-undef)
  user: UserDetails, //error ESLint 'UserDetails' is not defined.(no-undef)
}

Its purelly eslint fault. Everything is configured properly and flow by itself is happy.

How to tell eslint that these types are indeed declared as global? or should I add them to some ignore list?

Myers

Answer 1

It turned out (like I thought) the way is not to add global types to eslint ignore list. Actually it's is all handled by eslint-plugin-flowtype which I already had installed but I didn't extend it like:

.eslintrc

"extends": ["airbnb", "plugin:flowtype/recommended"],
"plugins": [
  "flowtype"
],

Myers

Answer 2

You can define global variables either using comments inside of a file, in the eslint configuration file or package.json. Read how to do it in eslint docs. If you need more help leave a comment.

Chalice

Is this only solution? I would then have to have ignored every type from flow-typed directory like: SyntheticInputEvent or Dispatch – Myers