javascript - 如何在 Typescript 中将 import 语句与 import all 语句结合起来？

Question

我有以下import使用 Typescript 的语句:

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'

缺点是该包被完全导入到 bundle 中，并且无法使用树摇动。

执行此操作的安全方法是:

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

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