React + TypeScript：'React' 指的是 UMD 全局，但当前文件是一个模块。考虑改为添加导入。（理由）

Question

我们在当前项目中使用 React 和 TypeScript，我遇到了以下行为。

import React, { Component } from 'react';

我用下面的一行替换上面的行，因为它似乎Component只使用导入。

import { Component } from 'react';

我被抛出以下错误

错误：“React”指的是 UMD 全局，但当前文件是一个模块。考虑改为添加导入。

我尝试在 Stack 和 GitHub 上查找，发现很少有文章和讨论，但仍不清楚为什么会发生这种情况。

会更感兴趣是 React 还是 Typescript 抛出它以及为什么？不是修复它的方法。

还有一些关于 UMD 的光线，为什么在这里使用它？

Answer 1

你在文件中渲染任何 jsx 吗？如果是这样，您确实需要导入 React，因为这些 jsx 标记会编译为对React.createElement(). 如果没有导入，对 React 的引用会尝试引用一个全局变量，这会导致该错误。

如果您使用 eslint，我建议您使用 eslint-plugin-react 并打开规则react-in-jsx-scope，这将捕获这种情况。

Answer 2

JSX 语法的转换方式取决于编译器选项，jsxFactory选项默认为React.createComponent. 这意味着<p/>被转译为React.createComponent('p'), 并且React预计存在于模块的范围内。

如果没有Reactimport，预计Reactglobal 应该存在。