Visual studio TypeScript和ES模块-我甚至需要汇总/网页包吗？

我有一个旧的TypeScript web应用程序，它通过HTML页面上包含的脚本引用所有内容，因此所有内容都在全局命名空间中声明。TypeScript代码使用TypeScript的模块-

myclass.ts：

module MyModule {
  export class MyClass {
 }
}

export class MyClass {
}

someotherfile.ts

let myInstance = new MyModule.MyClass(); // globally available

import { MyClass } from "./myclass";
let myInstance = new MyClass(); 

使用tsconfig.json中的“outFile”将所有TypeScript写入单个文件，这可能会对全局变量和写入顺序造成问题

我使用visualstudio，它内置了TypeScript支持。当您构建解决方案时，它会构建类型脚本

我想将代码更新为使用现代ES6模块：

myclass.ts：

module MyModule {
  export class MyClass {
 }
}

export class MyClass {
}

someotherfile.ts

let myInstance = new MyModule.MyClass(); // globally available

import { MyClass } from "./myclass";
let myInstance = new MyClass(); 

我最初认为我需要使用第三方库（如webpack或rollup）来实现这一点，但从TypeScript编译器生成的JavaScript来看，继续使用“outFile”似乎应该可以实现这一点——所有内容都包装在模块中，因此不应该在全球范围内可用：

Object.defineProperty(exports, "__esModule", { value: true });
var MyClass = /** @class */ (function () { ..}());
exports.MyClass = MyClass;

如果我要使用rollup或webpack，我对Visual Studio运行自己的tsc过程时如何工作感到有点困惑-大多数示例似乎都是针对使用npm typescript编译器的VS代码

---

不管怎样，我是不是错过了什么？有什么理由我不能跳过使用webpack或rollup吗

您需要rollup/webpack来绑定它们并导出一个全局命名空间。很遗憾，TypeScript不能为您这样做。@unional-全局命名空间中不是“导出”吗？

exports

在浏览器中未定义。如果您的意思是作为npm包发布，那么是的，您不需要汇总/webpack。@unional，这是一个浏览器应用程序。这就是为什么如果您只是将该文件包含到html中，它将不起作用。