导入 MouseEvent 疑问

来源:4-6 -补充Typescript类型基础知识-解答上一节的困惑

慕粉3946981

2023-05-09

请问这两种写法有什么区别?

import { MouseEvent } from 'react'
import type { MouseEvent } from 'react'
写回答

2回答

双越

2023-05-09

这俩写法作用相同。

(我记得课程里面有解释)

0
2
皮小西
回复
慕粉3946981
好像确实是没有讲过的,我也没有看到。
2024-04-28
共2条回复

皮小西

2024-04-28

有区别。

类型导入:

import type { FC } from 'react'

import type { FC } from 'react' 仅导入类型信息,不导入运行时的代码。这意味着这种导入的内容不会包括在最终的 JavaScript 包中。

这对于保持最终包的大小尽可能小是非常有用的,因为它确保 TypeScript 只会使用类型信息,而不会增加任何额外的运行时依赖。

使用 import type 可以明确表示这个导入仅用于类型检查,增加了代码的清晰度。

常规导入:

import { FC } from 'react'

在编译时,TypeScript 会处理类型信息,而在运行时,JavaScript 会加载 FC 的实际实现。如果 FC 有运行时代码,这些代码会被包含在最终的输出中。


0
0

React18+ Nest.js 全栈开发仿问卷星项目

React18+TS4+Antd5+Next.js13 ,B端+C 端,完整业务

385 学习 · 275 问题

查看课程