如何在打字稿中正确导入自定义类型

Posted 2023-03-13

【中文标题】如何在打字稿中正确导入自定义类型

【英文标题】：How to correctly import custom types in typescript

【发布时间】：2020-08-02 02:27:18

【问题描述】：

我在src/@types/app.d.ts（export type AuthKeyT = string）中有自定义类型

我想在 tsx 反应文件中使用它（使用 import AuthKeyT from '@types/app'），但我收到一个错误：

无法导入类型声明文件。考虑导入 'app' 而不是 '@types/app'

所以，当我使用 import AuthKeyT from 'app' 时，我得到：

找不到模块“应用程序”。

那么..怎么了？我应该如何导入自定义类型？

我在反应应用程序中使用打字稿3.7.2。

【参考方案1】：

正如错误所说，您无法在 TypeScript 中导入 .d.ts 文件。

import ... from 'app' 隐含的意思是import ... from 'app.ts' 或者这个文件不存在所以你得到第二个错误。

如果你想通过这个导入来使用你的类型，你必须把它们写在一个简单的.ts 文件中：

src/@types/app.ts:

export type AuthKeyT = string

使用此结构，您将能够使用以下方法导入此类型：

import  AuthKeyT  from 'app'

【讨论】：

在哪些情况下使用.d.ts文件？

如果你有一个app.ts 模块，你将在app.d.ts 中编写他的类型定义。所以当你import ... from 'app' 时，TypeScript 也会“导入”定义文件，因为它与模块同名。

什么情况下使用 ==> import type somthing from './typefile' ;

在我的情况下，通过从文件夹名称中删除 @，我能够导入而不会显示错误。前任。 src/types/config.ts

【参考方案2】：

您遇到此错误是因为 @types/... 是全局导入。例如import AuthKeyT from '@types/app' 表示您正在尝试从 node_modules 中的 @types 导入。

您可以通过将@types 更改为@customTypes 或在导入时更改类型文件夹的路径（例如@src/types...）来解决此问题。