Angular 模块从 es6 到 commonJs 结果

Question

我尝试导入 FileSaver对于我的应用程序。我让它工作的唯一方法是通过以下命令

import filesaver = require('filesaver');

然后我得到这个错误

Import assignment cannot be used when targeting ECMAScript 2015 modules

我通过将 tsconfig.json 中的模块从 es6 更改为 commonjs 来遵循解决方案。

现在一切正常。但是，我有点担心从 es6 更改为 commonjs 的后果是什么。显然是 es6 是有原因的，对吧？

有没有办法做到这一点我不必改变？

Answer 1

是的，如果您使用的是 TypeScript，请使用 es6/TypeScript 模块加载语法:

import { type } from './module';

当您将 TypeScript 编译为 JavaScript 时，您可以将任何您想要的模块加载器作为目标:

es6
system
commonjs
AMD
UMD

您可以从 tsconfig.json 定位模块系统:

"compilerOptions": {
  ...
  "module": "commonjs",
}

浏览器还不支持模块加载。在他们这样做之前，根据您使用的模块系统包含必要的脚本。

例如，如果您的目标是“system”或“commonjs”，那么请确保包含一个兼容的脚本以正确加载模块(即 node_modules/systemjs/dist/system.js)

我的建议，如果你正在用 TypeScript 编写你的 ng2 应用程序

恕我直言，es6 提供了最干净的模块加载语法。我更喜欢用 TypeScript 和 es6 语言特性(包括更简洁的模块加载语法)编写 Angular2 程序。在将 TypeScript 编译为 JavaScript 时，我尝试以 es5 为目标，因为当今大多数浏览器都提供接近 100% 的合规性而没有填充程序，并使用 systemjs 作为模块加载器(如果我以后想更改格式，这是最灵活的)。

在FileServer代码中，使用TypeScript编写，使用es6模块加载语法。这样，它将被编译为您所针对的模块加载器语法，这应该与您的其他 ts 文件一致。