私はグーグルクロージャーで比較的複雑なangular5プロジェクトをコンパイルしようとしています。
最初にtsickleを使用してコードをグーグルクロージャーに適した構文にコンパイルし、次にグーグルクロージャーを使用して最終的なバンドルを作成しようとします。
残念ながら、tsickleはグーグルクロージャーと互換性のないモジュールフォーマットを作成しているようです、私が持っているすべてのモジュールに対して次のエラーが発生します:
./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 angle5がクロージャーの構築を支援する意図があることを考えると、どういうわけかそれは機能するはずだと思います。
私の少しをチェックして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クロージャーと互換性がないようにします!
何をすべきか?それを回避する方法は?
tscソースコードを掘り下げることを含め、数時間グーグルした後、私は解決策を見つけました。
Typescriptは、基本的に、リフレクションのサポートがない場合の回避策としてこのヘッダーを作成します。これは、未使用のままであるすべての.jsファイルにこのことを含み、最終的なバンドルのサイズを増やすだけです。
「古い」ngc時代(角度2.x-4)では、このコードフラグメントは問題を引き起こしませんでした。ただし、そのモジュール形式ではthis
モジュールから直接使用できないため、Googleクロージャーとは互換性がありません。
TypeScriptには、この機能をオフにするオプションがあります。
--noEmitHelpers=true
国旗。tsickle
パラメータ処理で非常に強力ではない、最高挿入します
"noEmitHelpers": true,
あなたのにtsconfig.json
。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加