angular2 CLI (ember cli) を使用して typescript プロジェクトを生成しました。Chromium Web Developer ツールを使用してデバッグしています。開発者ツールの設定で「javascript ソース マップを有効にする」を選択しました。ソース ビューに .js ファイルと .ts が表示されます。ただし、.ts (typescript) ファイルを選択すると空として表示されます。つまり、ファイルが見つからないように見えます。
状況を示すスクリーン プリント:
.js ファイルを選択すると、そのテキストが表示されます。
.ts ファイルはdist ディレクトリにコピーされません。これは私には問題のように思えますが、典型的な angular2 cli dist 構造を示す例を他の場所で見たことがあり、.ts ファイルもありません。
ソース マッピングが有効になっていることを示す "tsconfig.json" の関連部分:
1 "compileOnSave": false,
2 "compilerOptions": {
3 "declaration": false,
4 "emitDecoratorMetadata": true,
5 "experimentalDecorators": true,
6 "mapRoot": "",
7 "module": "system",
8 "moduleResolution": "node",
9 "noEmitOnError": true,
10 "noImplicitAny": false,
11 "outDir": "../dist/",
12 "rootDir": ".",
13 "sourceMap": true,
14 "sourceRoot": "/",
15 "target": "es5"
16 },
js.map ファイルが生成され、.js ファイルの隣のdistディレクトリに置かれます。
マッピング ファイルの例 (部分):
{"version":3,"file":"app.js","sourceRoot":"/","sources":["app.ts"],"names":[],"mappings":";;;;;;;;;;;;;YAGA,mB
私は試しました:
1) .ts ファイルを src から dist にコピーします。
2) app.js.map ファイルを手動で編集しようとするさまざまな試み ( sourceRootやsourcesなど) 。
js.map ファイルで "/" が何を参照しているのかは明確ではありません: プロジェクトの src ディレクトリまたは dist ディレクトリですか? .js.map ファイルを編集した場合、それを取得するにはブラウザを更新する必要がありますか?
基本的な問題は、src ディレクトリで ts ファイルを探していることであり、これはブラウザーの手の届かないところにあると思います ("../src" にあるため)。
Chromium は、ts ファイルのパスを「http://localhost:4202/app/cpp-scenes.ts」として表示します。しかし、そこに .ts ファイルを配置すると、サイコロはありません。
これが js マッピングの問題なのか、Angular 2 の問題なのか、Angular2 CLI の問題なのか、typescript の問題なのかはわかりません。
コンソールに「blah.tsの52行目のエラー」と表示されるのは本当に苦痛ですが、そこにジャンプしてブレークポイントなどを設定することはできません.
Angular2 CLI プロジェクトでソース マッピングを機能させることができた人はいますか?
