使用 Typescript 导入行为

Question

我们如何从express导入

Request

、

Response

、

Express

接口

import express, {Express, Request, Response} from 'express';

检查了类型声明文件，我们仅默认导出函数

这是官方lib中index.d.ts文件的定义

declare function e(): core.Express;

declare namespace e {
    interface Express extends core.Express {}
    interface Request<
        P = core.ParamsDictionary,
        ResBody = any,
        ReqBody = any,
        ReqQuery = core.Query,
        Locals extends Record<string, any> = Record<string, any>,
    > extends core.Request<P, ResBody, ReqBody, ReqQuery, Locals> {}

    interface Response<
        ResBody = any,
        Locals extends Record<string, any> = Record<string, any>,
    > extends core.Response<ResBody, Locals> {}
}

export = e;

• 由于命名空间使用与函数相同的名称，所有属性都与函数合并，这意味着我们可以像这样从函数访问接口

  express.Request

  ，而不是像上面所示的

  named imports

  ？

我错过了什么吗？

预计

import express from 'express';
let {Express, Request, Response} = express

Answer 1

let {Express, Request, Response} = express

是 对象解构，这意味着您正在尝试在运行时提取该对象的 属性，而不是 TypeScript 类型。

import express from 'express';

导入快速运行时代码和编译时 TS 类型。这就是为什么您现在可以使用

const app = express()

创建 Express 应用程序，还可以使用

express.Request

来引用类型。

正是由于这种混乱，我更喜欢配置 eslint 来强制执行一致的类型导入，并且我对 TypeScript 4.5 中添加的导入名称上的类型修饰符的引入感到非常满意。它使类型和运行时代码之间的分离更加清晰。