VSCode中的流类型定义在哪里?

最后发布: 2017-10-03 17:15:33


问题

我使用create-react-native-app创建了一个新的React Native项目,并在文件顶部添加了// @flow以进行正确的类型检查。 然后,我添加了一个基本组件:

export class Foo extends React.component {
  render() {
    <Text>abcd</Text>
  }
}

您可能会注意到第2行中缺少return 。由于流程没有抱怨,因此我想添加类型注释,例如:

  render(): JSX.Element {

但是,我不知道如何导入JSX。 因此,我import React from 'react'语句跳转到import React from 'react'的定义文件,以查看其外观。 然后我突然注意到类型定义在index.d.ts中声明,即Typescript定义文件: 反应的打字稿定义

这是流型React(Native)项目的通常行为吗? 我认为这会很奇怪,因为两种语言不同。 如果没有,如何使VSCode使用Flow定义呢?

reactjs react-native flowtype
回答

我假设:

  • 您的Foo组件具有.js扩展名
  • 当您添加返回类型: JSX.Element时,VSCode并没有抱怨只允许在.ts文件中使用类型。

这建议将VSCode设置为使用Flow而不是Typescript。 意味着您的错误看起来像这样:

在此处输入图片说明

我正在使用这个扩展名

假设这是真的,您可以像这样导入JSX名称空间:

import JSX from 'react';

如果您忘记了return语句,它将发出以下编译器警告:

在此处输入图片说明

请注意,您需要在JSX.Element上使用类型参数。 编译器将接受JSX.Element<any>甚至JSX.Element<> ,但不JSX.Element