Typescript 到 Javascript 导出答案

【问题标题】：Typescript to Javascript exportTypescript 到 Javascript 导出
【发布时间】：2019-06-12 08:26:28
【问题描述】：

我有一个示例打字稿对象

declare const S3 = "https://s3.amazonaws.com/xxx/icons";
declare const SVG = "svg-file-icons";

declare interface MyIcons {
  "image/jpeg": string;
  "image/jpg": string;
}

export const FILE_ICONS_SVG: MyIcons = {
  "image/jpeg": `${S3}/${SVG}/jpg.svg`,
  "image/jpg": `${S3}/${SVG}/jpg.svg`
};

我在一个共享 NPM 包中声明这个对象，以保持我所有项目的一致性。但是 TSC 编译给了我这样的东西。

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FILE_ICONS_SVG = {
    "image/jpeg": `${S3}/${SVG}/jpg.svg`,
    "image/jpg": `${S3}/${SVG}/jpg.svg`
};

很明显 S3 和 SVG 没有在编译的 js 文件中定义，因此在使用时会出错。

如何解决？

【问题讨论】：

declare const 是做什么的？
const 这样做，但 declare 关键字有什么作用？
What does 'declare' do in 'export declare class Actions'?的可能重复
你去 - 显然，这就是 declare 所做的。
不，不是——看看骗子。它有不同的语义。

标签： javascript typescript ecmascript-6

【解决方案1】：

使用declare 并没有真正“声明”什么。

declare 仅用于告诉 type-system 存在具有声明名称和类型的东西。

如果您想定义一个应该存在于类型系统之外的常量，也就是在运行时存在，您必须删除 declare 关键字。

declare'd 的东西对运行时没有任何影响

为什么`declare` 存在？

如果您考虑 Web 的工作原理，您就有一个 html 文件。在该 html 中，您可以包含脚本。这些脚本可能完全相互独立，但也使用其他脚本的内容。

因此，如果您有一个文件将某些内容附加到 window，例如在一个文件中，并且有另一个文件使用该对象，则打字稿类型系统无法知道该对象存在，所以您可以通过 declare 告诉类型系统它的存在

应该是这样的

const S3 = "https://s3.amazonaws.com/xxx/icons";
const SVG = "svg-file-icons";

【讨论】：

为什么declare 存在？

为什么`declare` 存在？