如何以赢得'；t使用普通的老式JavaScript中断对对象的访问

请原谅我在这方面的无知，我陷入困境，希望得到一些指导方向

以TypeScript上的

迎宾员
类为例：

我的任务是构建和管理一个组件，它既可以在普通的HTML+JavaScript环境中使用，也可以在角度应用程序中使用。我正在用TypeScript管理/编写这段代码，并使用TypeScript将输出编译为JavaScript

回到上面的例子，如果我想使该类在Angular中可用（作为导入），我需要导出该类吗

export class Greeter {
    ...
}

当我这样做时，页面会抛出错误：

未捕获引用错误：未定义定义

编译后的JavaScript如下所示：

define(["require", "exports"], function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Greeter = /** @class */ (function () {
        function Greeter(message) {
            this.greeting = message;
        }
        Greeter.prototype.greet = function () {
            return "Hello, " + this.greeting;
        };
        return Greeter;
    }());
    exports.Greeter = Greeter;
    var greeter = new Greeter("world");
});

由于Greeter类现在绑定到该定义块，因此我显然无法实例化这样的新类：

让迎宾员=新迎宾员（“世界”）；//<--不起作用。

抛出错误：

Uncaught ReferenceError:未定义迎宾员

我将如何导出该类，以一种不会中断访问对象的方式（比如说以普通JavaScript方式）呢
我想做的事可能吗
这是一个合理的目标，还是我完全走错了方向
好问题，你问的绝对是合理的

首先值得一提的是，您所指的“普通JavaScript”是ES5与AMD模块库的兼容性。ES6在JavaScript中引入了本机语言级模块，这就是
export
和
import
语法

TypeScript有一个
--module
，可以让您选择编译哪个模块目标并为其生成输出。然而，对于外部模块系统，比如
AMD
和
CommonJS
，它实际上并不输出使其工作所需的模块系统，它只是发出与这些系统兼容的JavaScript。由您决定是否包含模块系统，例如，或在内置支持的环境中运行，如NodeJS的CommonJS模块系统。如果将
--module
目标设置为
es6
，您将看到它保留了
导出
语句，这将在支持es6模块的浏览器中工作（假设导入路径解析为浏览器可以访问的文件）

另外值得一提的是，使用Webpack或Browserify之类的JavaScript绑定器，您几乎可以从TypeScript获取任何模块输出，并将其绑定到浏览器，而无需自己引入模块运行时，因为绑定器会处理它

希望对您有所帮助。
define
出现在操场上，因为它默认为AMD模块。在实际代码中，情况并非如此，这取决于
module
compiler选项设置为什么。代码与角度有多大的关联？首先是棱角的还是棱角的？是否在角度项目源文件中使用此文件？在这种情况下，它将被编译为其他文件。你把它导出为NPM包吗？它是有角度的，不是AngularJS。至于将它与Angular一起使用，目前还不完全是这样，但我的想法是，是的，我想导入该文件，然后将其定义为一个组件。现在，不是NPM包，而是同样的想法，在根应用程序的某个地方包含一个通用的JS包，引用它或导入它并在应用程序中使用。这是从头开始设置Angular应用程序时必须解决的众多问题之一。根据经验，Angular应用程序将Angular CLI用于脚手架和建筑。它已经为您配置了TS。另一种方法是使用样板项目，它同样已经为您配置了TS。出于实际目的，你可以坚持这些原则，并从中学习如何在那里做事。您可以从官方的Angular plunk学习，其中当然包含TS配置，谢谢@Aaron，感谢您的反馈！非常有用。将考虑所有这些要点并相应地重构。
define(["require", "exports"], function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var Greeter = /** @class */ (function () {
        function Greeter(message) {
            this.greeting = message;
        }
        Greeter.prototype.greet = function () {
            return "Hello, " + this.greeting;
        };
        return Greeter;
    }());
    exports.Greeter = Greeter;
    var greeter = new Greeter("world");
});