angular 2つのアプリがFirefoxとChromeの内部で動作していますが、(ため息)IEの内部ではそれほど動作していません。スタックトレースに基づくと、Systemjsのセットアップに問題があるようです。 。
これが私のWebコンソール内に表示されるエラーの説明です。
Error: (SystemJS) Syntax error
SyntaxError: Syntax error
at ZoneDelegate.prototype.invoke (http://localhost:8050/node_modules/zone.js/dist/zone.js:230:13)
at Zone.prototype.run (http://localhost:8050/node_modules/zone.js/dist/zone.js:114:17)
at Anonymous function (http://localhost:8050/node_modules/zone.js/dist/zone.js:502:17)
Evaluating http://localhost:8050/app/app.module.js
Error loading http://localhost:8050/app/app.module.js as "./app.module" from http://localhost:8050/app/main.js
私を見つけることができないようです
app/app.module.js
しかし、私が言ったように、私はFirefoxとChromeでこの問題を抱えていません。
インターネットを少し調べて、ポリフィルシムについて何かを見つけました。そこで、index.htmlに次のものを含めてみました。
<script src="/node_modules/core-js/client/shim.min.js"></script>
<script src="/node_modules/systemjs/dist/system-polyfills.src.js"></script>
私はこれが迅速な修正を可能にすることを望んでいましたが、そうではないようです。この時点からどのように進めるかについて、誰かが何かアドバイスはありますか?
編集:
IE 11Webコンソール内に入っている404を発見しました。
リクエストがヒットしようとしているようです
URL Protocol Method Result Type Received Taken Initiator Wait Start Request Response Cache read Gap
/node_modules/systemjs/dist/Promise.js.map HTTP GET 404 text/html 210 B 16 ms XMLHttpRequest 140 0 16 0 0 5266
またはsystemjsフォルダー内のPromise.js.mapですが、そこにはありません。
だから、いくつかの新しい質問
1)私が試した他のブラウザでこのリクエストが行われない/必要とされないのはなぜですか?
2)このファイルは何をしますか、どこで入手できますか?これを取得した後、構文エラーがクリアされるかどうかはまだわかりませんが、開始するのに妥当な場所のようです。
削除/コメントアウトした後も気づきました
<script src="/node_modules/systemjs/dist/system-polyfills.src.js"></script>
Promise.js.mapへのリクエストはもう行われません。したがって、ポリフィルが正確に何をするのかはわかりませんが、404をもたらすこのリクエストを導入しているようです。
編集2:
詳細に説明されているように、tsconfig.jsonにあるES6ターゲットをES5ターゲットに切り替えてみました ここ 。さて、ビルドしようとすると、他にもたくさんの問題が発生します。スタックトレースは この投稿 でうまく説明できます。
ES5ターゲットに切り替えると、Map、Promiseなどにアクセスできなくなります...
これを追加するなど、その質問の修正のいくつかを見てみました
///<reference path="node_modules/angular2/typings/browser.d.ts"/>
main.tsファイルの先頭にありますが、angular2フォルダーがなく、代わりに@angularフォルダーがあります。そして、typingsディレクトリはどこにも見つかりません。私はこれをgradleでビルド/デプロイしているので、ローカルマシンにnpmインストールタイピングを実行して1日呼び出すことはできません...
編集3:私はこれに報奨金を提供しました。最近、別のシムを試しました。
<script src="/node_modules/core-js/client/shim.min.js"></script>
これはまだ私には機能していません。同じ元の構文エラーが発生します。
Main.tsファイルを見る
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
platformBrowserDynamic().bootstrapModule(AppModule);
3行目をコメントアウトすると、Webコンソールのエラーは消えますが、もちろんアプリはブートストラップされません。
キックのためだけに、これが私のtsconfig.jsonです
{
"compilerOptions": {
"target": "es6",
"module": "system",
"moduleResolution": "node",
"experimentalDecorators": true
},
"exclude": [
"node_modules",
"jspm_packages"
]
}
私はついにこれを手に入れました、それは簡単ではありませんでした。私はいくつかの異なることを修正する必要がありました。
1)tsconfig.jsonの「ターゲット」を「es5」に設定する必要がありました
{
"compilerOptions": {
"target": "es6", ==> "target" : "es5",
"module": "system",
"moduleResolution": "node",
"experimentalDecorators": true
},
"exclude": [
"node_modules",
"jspm_packages"
]
}
2)index.htmlファイルに正しいシムを含める必要がありました
<script src="/node_modules/core-js/client/shim.min.js"></script>
これらの2つのことを行った後でも、ビルドプロセスのTS-> JSトランスパイルステップで、次のような巨大なスタックトレースがありました。
node_modules/rxjs/operator/toPromise.d.ts(7,59): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(7,69): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(9,9): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(10,26): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(10,36): error TS2304: Cannot find name 'Promise'.
3)最後のステップ、この参照を明示的に含める必要がありました
/// <reference path= "../node_modules/TypeScript/lib/lib.es6.d.ts" />
App /main.tsファイルの上部にあります。
これらの3つのステップを実行してプロジェクトを再構築した後、ようやくIEでの作業が開始されました。