替换 Typescript 包上的 'require'

Question

我有一个主要的 TypeScript 文件，其中导入了另一个文件，如下所示：

import './app.run';

我使用 tsproject 将我的 ts 文件编译成一个包，然后在我的 html 页面中使用 System JS，如下所示：

System.import('app/app.module');

但是在我的包中，所有文件导入都被 commonjs require 语句替换，如下所示：

require('./app.run');

虽然不再存在 app.run 文件，因为所有内容都已捆绑。如何在没有外部文件导入的情况下正确捆绑 ts？

Answer 1

在最新版本的 TypeScript (which is 1.5 at the time of writing) 中，您将使用 ES6 样式的模块导入：

import * as Alias from "./app.run";

并使用 SystemJS 模块种类进行编译。

tsc --module systemjs app.ts

这应该是达到您想要的目的的最简单途径。 SystemJS 支持是 1.5 中全新的。

内部/外部模块注意事项...

内部和外部模块存在很多混淆，但我（强烈）建议you shouldn't mix internal and external modules。

内部模块背后的想法是模拟编写 JavaScript 时使用的通用模式来隐藏信息而不是将其放在全局范围内。道格·克罗克福德 (Doug Crockford) 在这方面广为流传。本质上，如果你有这个 JavaScript:

var name = 'Nicky';
function sayHello() {
    return 'Hello ' + name;
}

您可以将 name 和 sayHello 移出全局范围并将您的足迹减少到单个变量：

var myNamespace = (function() {
    var name = 'Nicky';
    return {
        sayHello: function () {
            return 'Hello ' + name;
        }
    };
}());

这是令人钦佩的，因为有可能另一个库将定义 name 或 sayHello，最后加载的那个将获胜。

对于外部模块，文件就是模块。这实际上比上面的名称空间示例好一个，因为 nothing 最终出现在全局范围内。当你加载一个模块时，你给它一个本地名称并且没有污染。因此，您不需要将外部模块组织到内部模块或命名空间中。事实上，尝试这样做只会让您的代码变得更糟，而不是更好。

TypeScript 团队正在将内部模块重命名为 "namespaces" - 请参阅 "Simplifying modules" in the TypeScript 1.5 release notes 下的说明。虽然这将解决 "internal" 或 "external" 之间的混淆，但我认为它不会完全解决组合这两种模式的混淆。

Considering your reputation Steve, I am convinced

没有人的声誉意味着他们的话应该是无懈可击的 - 所以请根据您自己的经验做出最终决定。在这种情况下，您应该从骨子里感觉到内部和外部模块的组合正在创建不舒服的代码，而没有增加任何好处；但我可能是错的。

替换 Typescript 包上的 'require'

Replace 'require' on Typescript bundle

typescript

commonjs

systemjs