如何在Typescript中将import语句与import all语句组合？

Question

我使用Typescript编写了以下import条语句：

import * as React from 'react';
import { MouseEvent } from 'react'

Typescript抱怨我应该合并这些多个导入。我尝试了以下操作，但是导入的MouseEvent是不同的：

import MouseEvent, * as React from 'react'

在此组合的导入语句中，MouseEvent与通过import { MouseEvent } from 'react'导入的语句不同。

由于某种原因，Typescript认识到MouseEvent中的import { MouseEvent } from 'react'接受类型泛型，但MouseEvent中的import MouseEvent, * as React from 'react'却不接受。

如何在保持通用的MouseEvent的同时合并导入语句？

Answer 1

TypeScript不能抱怨这些导入语句，因为它们是正确的。 TSLint可以抱怨它们并导致错误。

无法将它们缩短为一行。常用的方法是使用React还提供的默认导出：

import React, { MouseEvent } from 'react'

不利之处在于，该软件包已完全导入捆绑包中，无法利用摇树的作用。

一种安全的方法是：

import * as React from 'react';
import { MouseEvent } from 'react'

如果这导致TSLint错误，则需要禁用相应的规则。

Answer 2

使用import * as React from 'react'时，将整个模块导入一个名为React的变量中。因此，您可以通过MouseEvent命名空间React访问React.MouseEvent。由于您已经将所有内容都导入到一个变量中，因此您无法再导入其他特定内容。