gpt4 book ai didi

TypeScript:多文件类+模块合并的替代方案

转载 作者:搜寻专家 更新时间:2023-10-30 22:03:05 24 4
gpt4 key购买 nike

在我们预先存在的代码库中,我们使用 JavaScript 的“类是函数,函数是对象”方面来进行命名空间。

例如,假设我们有一个名为 Foo 的类,它包含一个名为 Bar 的类。

Foo 是一个全局导出的对象(即,它存在于 window.Foo 中),而 window.Foo.Bar 是 Bar 的构造函数。 (我认为可以公平地说这是一种常见的 JavaScript 模式)。

确实,此模式会产生方向依赖性。 Foo 必须在 Bar 之前加载。我们使用 stealjs 完成此操作,这是一个不符合 AMD 协议(protocol)的异步模块加载器。出于这个原因,我们不能使用 TypeScript 的内置导入/导出 AMD 代码生成。至少,直到我们花了数周的时间将我们的整个代码库移植到 requirejs 之前是这样。

为了在 TypeScript 中匹配这种模式,我们使用一个名为 Foo 的,并且还有一个名为 Foo 的模块

class Foo {
/* Foo's properties */
}

module Foo {
export class Bar {
/* Bar's properties */
}
}

这是合法的 TypeScript,它编译为上述 JavaScript 情况:Foo 类对象将包含 Bar 类对象作为其“Bar”属性。Foo 模块被称为与 Foo 类合并,而 Bar 被称为内部类

但是,如果我简单地将这两个语句分开到单独的文件中:

// Foo.ts
class Foo {
/* Foo's properties */
}

// Foo/Bar.ts
module Foo {
export class Bar {
/* Bar's properties */
}
}

这不再是合法的 TypeScript,并且无法编译。 [1](尽管事实上我们可以并且会安排在第一个文件通过我们自己的模块加载器加载之后加载第二个文件。)

这对我们来说是个大问题,因为我们不会将所有内部类声明都压缩到一个文件中。据我所知,实际上没有解决方案。我们只需要污染全局命名空间,并且不能将内部类与我们的命名空间合并。

如果我们使用 TS 的内置导入/导出语义,则不会出现此问题,但由于上述原因,我们没有出现。将所有内容移植到 requirejs 现在还不在讨论之列。鉴于我们的情况,您认为解决类模块合并限制的最佳策略是什么?

[1] TypeScript: Module x cannot merge with previous declaration of x in a different file

最佳答案

您可以一次切换到 require.js AMD 片段,而不是一次重写所有内容。事实上,最简单的方法是依靠 TypeScript 的内置 AMD 支持,因为它可以自动执行很多你需要做的事情,而且 TypeScript 中的导出和导入语法非常容易使用。您未在 TypeScript 中向其添加导出或导入语句的文件将按当前状态构建,使用导出/导入的文件将成为 AMD 模块。这有一点学习曲线,因为您需要添加一个 require 配置并开始使用 require(['mytsamd'], function (mytsamd) {/* do stuff with mytsamd */}) 非 TypeScript 文件中需要引用 AMD 对象的模式(或将其转换为类似 Q.js 的 promise )。

关于TypeScript:多文件类+模块合并的替代方案,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24496134/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com