typescript 从打字稿类型定义文件导出枚举
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/50564756/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
exporting enum from typescript type definition file
提问by t.animal
I'm writing the type definitions for a library I'm using. One function in the library identifies the mouse button clicked by an integer:
我正在为我正在使用的库编写类型定义。库中的一个函数标识由整数单击的鼠标按钮：
//index.d.ts
export as namespace myLib;
// activates the library listening for a specific mouse button
function activate(button : number ) : void
I introduced an enum to make this nicer:
我引入了一个枚举来使它更好：
//index.d.ts
export as namespace myLib;
export enum MouseButton {
LEFT = 1,
MIDDLE = 2,
RIGHT = 4
}
export function activate(button : MouseButton ) : void;
Now, when I import this function and use it, everything compiles but I guess the enum is stripped and undefined when executed in the browser. The error message says Cannot read property 'LEFT' of undefined.
现在，当我导入这个函数并使用它时，一切都会编译，但我猜枚举在浏览器中执行时被剥离和未定义。错误消息说Cannot read property 'LEFT' of undefined。
Therefore I rearranged the files like so:
因此，我像这样重新排列了文件：
//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;
Now I can import {MouseButton} from "myLib/MouseButton"; import * as myLib from "myLib". But this requires two imports. Referencing myLib.MouseButtonstill compiles but doesn't run.
现在我可以了import {MouseButton} from "myLib/MouseButton"; import * as myLib from "myLib"。但这需要两次导入。引用myLib.MouseButton仍然编译但不运行。
Is there any way to import and reference the MouseButtonenum via the myLibimported via the import * as myLibstatement? I'm not only looking for an answer explaining how to do it but for one explaining why my solution doesn't work or why it isn't possible. Hints to resources explaining what's wrong are also appreciated
有没有办法通过语句导入和引用MouseButton枚举？我不仅在寻找解释如何做的答案，而且在寻找解释为什么我的解决方案不起作用或为什么不可能的答案。对解释错误的资源的提示也表示赞赏myLibimport * as myLib
PS: I also tried the syntax suggested here re-export Typescript enum from namespace?but that didn't work either.
PS：我也尝试过这里建议的语法从命名空间重新导出 Typescript 枚举？但这也不起作用。
PPS: The module in question is a UMD module from the cornerstone project (https://github.com/cornerstonejs/cornerstone) used in an angular 6 project.
PPS：有问题的模块是来自基石项目 ( https://github.com/cornerstonejs/cornerstone)的 UMD 模块，用于 angular 6 项目。
采纳答案by Romain Deneau
(To complete t.animal's own answer)
（完成t.animal自己的回答）
Declaration files are difficult to make: see the long documentation. Sometimes looking in existing .d.ts files can help.
声明文件很难制作：请参阅长文档。有时查看现有的 .d.ts 文件会有所帮助。
Regarding enum, declaring them as const enumis a clean and simple approach. It's
what is done for jquery for instance, see @types/jquery/index.d.tsfor Mouseand Key. It's handy because standard enums are compiled in JavaScript as arrays while const enummembers are compiled directly as values ; see TypeScript Playground.
关于enum，将它们声明为const enum一种干净简单的方法。例如，这是为 jquery 所做的，参见@types/jquery/index.d.tsfor Mouseand Key。这很方便，因为标准枚举在 JavaScript 中编译为数组，而const enum成员则直接编译为值；见打字稿操场。
回答by t.animal
Solved it by the help of Romain Denau's commentabove. It nudged me in the right direction: What code does the typescript compiler generate from an enum (see https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime)? Declaring the enum constallows the typescript compiler to completely swap the identifier with the respective value, effectively inlining it. No more leakage of the enum into the production code. Thanks!
在上面的Romain Denau 评论的帮助下解决了这个问题。它把我推向了正确的方向：打字稿编译器从枚举生成什么代码（参见https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime）？声明枚举const允许打字稿编译器将标识符与相应的值完全交换，有效地内联它。枚举不再泄漏到生产代码中。谢谢！
//index.d.ts
export as namespace myLib;
export const enum MouseButton {
LEFT = 1,
MIDDLE = 2,
RIGHT = 4
}
export function activate(button : MouseButton ) : void;
回答by TeemuK
From my short research on the topic, I noticed that exporting the enums from the type definition file using export enum constis a bad idea. Since you have to enable the --isolatedModulesflag which isn't even possible in say create-react-appand it can get messy.
从我对该主题的简短研究中，我注意到使用从类型定义文件中导出枚举export enum const是一个坏主意。由于您必须启用--isolatedModules甚至不可能的标志，create-react-app并且它可能会变得混乱。
Instead, I myself used the normal syntax in my shared.d.tsfile:
相反，我自己在我的shared.d.ts文件中使用了正常语法：
export enum EReviewStatus {
PENDING = 'PENDING',
SENT = 'SENT'
}
And then I have a .jsfile, which is imported in the package.jsonmain-block eg:
然后我有一个.js文件，它被导入到package.json主块中，例如：
"main": "shared.js",
Where I have (using CommonJS export to make it compatible in both Node.js and frontend):
我在哪里（使用 CommonJS 导出使其在 Node.js 和前端兼容）：
module.exports.EReviewStatus = {
PENDING: 'PENDING',
SENT: 'SENT'
}
Which works and I think is better practise, as now your code is clearly separated from the types.
哪个有效，我认为是更好的做法，因为现在您的代码与类型明显分离。
