从typescript类型定义文件导出枚举

d8tt03nd  于 2023-01-18  发布在  TypeScript
关注(0)|答案(4)|浏览(623)

我正在为我使用的一个库编写类型定义,库中的一个函数标识了一个整数所点击的鼠标按钮:

//index.d.ts
 export as namespace myLib;
 // activates the library listening for a specific mouse button
 function activate(button : number ) : void

我引入了一个枚举来使它更好:

//index.d.ts
export as namespace myLib;
export enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

export function activate(button : MouseButton ) : void;

现在,当我导入这个函数并使用它时,所有的东西都编译了,但是我猜当在浏览器中执行时枚举被剥离并且未定义。
因此,我重新排列文件如下:

//MouseButton.ts
export enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

//index.d.ts
export as namespace myLib;
import {MouseButton} from MouseButton;
export {MouseButton} from MouseButton;
export function activate(button : MouseButton ) : void;

现在我可以使用import {MouseButton} from "myLib/MouseButton"; import * as myLib from "myLib"了,但是这需要两次导入,引用myLib.MouseButton仍然可以编译,但是不能运行。
是否有任何方法可以通过import * as myLib语句导入的myLib来导入和引用MouseButton枚举?我不仅要寻找一个解释如何操作的答案,还要寻找一个解释为什么我的解决方案不起作用或为什么它不可能的答案。对解释错误的资源的提示也很受欢迎
PS:我也尝试了这里建议的语法re-export Typescript enum from namespace?,但也不起作用。
PPS:有问题的模块是一个角6项目中使用的基石项目(https://github.com/cornerstonejs/cornerstone)的UMD模块。

f0brbegy

f0brbegy1#

我在上面罗曼·德诺评论的帮助下解决了这个问题,它把我推向了正确的方向:typescript编译器从枚举生成什么代码(参见https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime)?声明枚举const允许typescript编译器将标识符与相应的值完全交换,从而有效地将其内联。不会再将枚举泄漏到生产代码中。谢谢!

//index.d.ts
export as namespace myLib;

export const enum MouseButton {
    LEFT = 1,
    MIDDLE = 2,
    RIGHT = 4
}

export function activate(button : MouseButton ) : void;
cyvaqqii

cyvaqqii2#

  • (完成动物自己的回答)*

申报文件难以制作:查看长documentation。有时查看现有的.d.ts文件会有所帮助。
对于enum,将它们声明为const enum是一种干净而简单的方法。例如,jquery就是这样做的,请参见MouseKey的@types/jquery/index.d.ts。这很方便,因为标准枚举在JavaScript中编译为数组,而const enum成员则直接编译为值;请参见类型脚本Playground。

o7jaxewo

o7jaxewo3#

从我对这个主题的简短研究中,我注意到使用export enum const从类型定义文件中导出枚举是个坏主意,因为你必须启用--isolatedModules标志,这在create-react-app中甚至是不可能的,而且会变得很混乱。
相反,我自己在shared.d.ts文件中使用了常规语法:

export enum EReviewStatus {
    PENDING = 'PENDING',
    SENT = 'SENT'
  }

然后我有一个.js文件,导入到package.json主块中,例如:

"main": "shared.js",

我有(使用CommonJS导出,使其在Node.js和前端兼容):

module.exports.EReviewStatus = {
  PENDING: 'PENDING',
  SENT: 'SENT'
}

这很有效,而且我认为这是更好的做法,因为现在您的代码与类型是明确分离的。

ymdaylpp

ymdaylpp4#

无法从.d.ts文件导出枚举。请创建另一个文件(可能是constants.ts),然后从该文件导出相同的枚举。
因为枚举更像是变量而不是类型或接口。
希望能帮上忙!😊😊😊😊

相关问题