在 TypeScript 中构建大型复杂模块答案

【问题标题】：Structuring a large complex module in TypeScript在 TypeScript 中构建大型复杂模块
【发布时间】：2012-11-05 23:38:54
【问题描述】：

我正在 TypeScript 中创建一个复杂的模块（解析 PE 文件结构，类似于 Mono.Cecil 所做的，但在 TS/JS 中并且不太复杂）。

问题是如何最好地将该功能放在文件/文件夹/模块维度中。

我从类似于 C# 的结构开始，每个类都在自己的文件中，命名空间（模块）对应于或多或少独立的功能并位于子文件夹中。

现在在 TypeScript 中有几个问题。或者问题可能在于我的愚蠢？

单独文件中的每个类都适合开发，但对编译后的输出没有意义。没有人愿意随身携带 24 个文件而不是一个。
如果我将所有内容编译到一个文件中 (tsc -out)，每个单独文件的内容几乎都是独立发出的，即使它们都属于同一个模块。 TypeScript 使用一些时髦的 hacky 语法来构建该模块，而不是我手动编写的（这会将它们全部粘贴在一个模块定义的立即调用函数中）。
我希望我的东西可以在 Node.js 和浏览器中运行。对于 Node，我需要使用“导出模块”来添加所有内容，但对于浏览器，典型的用法是生成whatever.js 并让页面包含它——这意味着我应该去掉“导出模块”。

最好的办法是什么？

【问题讨论】：

这是一个非常广泛的问题。一般来说，您会使用 TypeScript 之外的 web 捆绑。如果您希望它在 web 和 nodejs 上都可运行，您可以使用模块标志为 node 编译 commonjs 和为 web 编译 amd。有一个未完成的功能请求允许相同的 TypeScript 代码在所有平台上工作，但在此之前将 amd 与 requiresjs 一起使用允许您在 web 上重用与 nodejs 上相同的 TypeScript 代码。
只有当我想让它在 web 上做 AMD 时。但是大多数现实世界的库（你知道，jQuery，Knockout ......）不做那个 AMD 仪式，它们只是为你提供一个脚本，你可以从 HTML 中引用它。我不介意使用不同的选项重新编译，但是更改 14 个文件中的 18 个位置以添加/删除“导出”是不可行的。
我目前的做法是将我的东西放入非导出模块中。这意味着在 Web 上，它将该模块添加到全局范围中，并且脚本可以使用它。在 Node 上，我添加了一个额外的代码，手动使用“exports”变量来满足 Node 的模式。
未完成的功能请求可能会有所帮助。它将允许您编写捆绑样式的代码并为 nodejs 删除模块包装器。您目前使用什么来组合和最小化网络？
结合我使用'tsc -out'，它将所有输出推到一个文件中。

标签： typescript

【解决方案1】：

如果您不想要 browserify（参见 BGR 的回答），您可以创建 2 个构建过程，一个用于 CommonJS（节点），另一个用于 RequireJS（浏览器）。 2 个构建可以将它们的结果输出到其他文件夹（例如projectRoot/dist/server）。地狱般的 Grunt/Gulp 项目，但并非不可能。

为了更好的可用性，我还创建了一个 包装文件，其中没有类/接口，它只包含其他文件并选择要导出的内容。我刚刚得到了一些提示： TypeScript export imported interface

【讨论】：

【解决方案2】：

Typescript 1.0+ 的答案是使用 CommonJs 语法的模块

传递tsc 标志

--module commonjs

要生成 CommonJS 样式模块并在 Typescript 文件中，使用 require 语法导入资源

import A = require('./A')  //no .ts in the name

要在浏览器中使用，请使用browserify，很可能与grunt-browserify 相关联

【讨论】：

【解决方案3】：

我目前正在使用 require.js 和 amd 模块来构建代码。每个类都在一个文件中，只需要一个 require.js 引导程序。我不使用节点，所以不能在这里发表评论，但它可能值得一看。 http://blorkfish.wordpress.com/2012/10/23/typescript-organizing-your-code-with-amd-modules-and-require-js/

【讨论】：

谢谢，很好的描述，很详细。同时它也非常突出了 AMD 与仅仅在页面上粘贴
在大型（> 100,000 LOC）网络应用程序上工作，让我知道这对史蒂夫来说是如何工作的。