尝试用 tsickle/closure 编译 angular5 项目，我得到 "The body of a goog.module cannot reference this."

Question

我正在尝试用 google 闭包编译一个相对复杂的 angular5 项目。

首先我使用 tsickle 将代码编译成 google 闭包友好的语法，然后我尝试使用 google 闭包来创建最终的包。

不幸的是，tsickle 似乎创建了一个与 google 闭包不兼容的模块格式，我的所有模块都出现以下错误：

./path/to/my.component.js:8: ERROR - The body of a goog.module cannot reference this.
var __metadata = (this && this.__metadata) || function (k, v) {

但是，考虑到最近的 ngc -> tsickle switch with angular5 的 intention 以帮助构建闭包，我认为它应该可以工作。

稍微检查一下我的 path/to/component.js，我在开头发现了这个：

goog.module('target.path.to.MyComponent');var module = module || {id: 'target/path/to/MyComponent.js'};
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};

看起来，typescript 编译器（由 tsickle 在内部调用）将此代码放在所有模块之前，它在 tsickle 不知情的情况下执行此操作，并且它使模块格式与 google 闭包不兼容！

怎么办？如何解决？

Answer 1

经过几个小时的谷歌搜索，包括对 tsc 源代码的一些挖掘，我找到了解决方案。

Typescript 创建此 header 本质上是作为缺少某些反射支持的解决方法。它将这个东西包含在所有未使用的 .js-files 中，只会增加最终包的大小。

在"old" ngc时代（angular 2.x - 4），这段代码没有出问题。但它与 google 闭包不兼容，因为它的模块格式不允许直接从模块使用 this。

TypeScript 可以选择使用

关闭此功能

--noEmitHelpers=true

标志。由于tsickle对参数处理不是很强，最好插入一个

"noEmitHelpers": true,

进入你的 tsconfig.json.

尝试用 tsickle/closure 编译 angular5 项目，我得到 "The body of a goog.module cannot reference this."

Trying to compile angular5 project with tsickle/closure, I get "The body of a goog.module cannot reference this."

javascript

angular

typescript

tsickle