Visual Studio 2017でのAngular 5デバッグ:ブレークポイントが機能しない
私はTypeScriptのデバッグで問題に直面しており、ブレークポイントを作動させることに文字通り迷っています。
問題:
私は Visual Studio 2017 で、統合された angular-cli アプリ(現在は互換性があり、もはや webpack 設定ファイルを必要としない)で作業していますが、TypeScript ファイルにブレークポイントを置いても、ブレークポイントがヒットしません。
私は tsconfig.json で "sourceMap: true" ブール値を有効にしました。理論上は、これが唯一編集すべきファイルのはずです。
現在の tsconfig.json の内容は以下の通りです:
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"strict": false,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]
}
}
必要であれば、さらに情報や私のコードを共有できることをうれしく思いますが、実際には以下のCMD/PowerShellコマンドで作成されたAngularアプリをVisual Studio 2017でデバッグしようとするだけで、簡単に問題を再現できます:
dotnet new --install Microsoft.DotNet.Web.Spa.ProjectTemplates::2.0.0
dotnet new angular -o my-new-app
cd my-new-app
cd ClientApp
npm update
質問:
Visual Studio 2017でAngular TypeScriptのデバッグを有効にするために、正確に何を設定すべきか教えてもらえますか?
よろしくお願いします!
重要な編集
Visual Studioのtsデバッグの代替
新しいAngular 6+アプリでは、webpack.configファイルがなくてもChromeの開発者ツールを使ってデバッグが可能なようです。
tsconfigでsourceMap:trueを有効にすると、.tsファイルもデバッグできます。
ここで読んだところによると、"webpack"のコードセクションでそれらを見つけることができます。
Visual Studioはどうですか?
新しいVisual Studioのアップデートの1つでスクリプトデバッグが可能になりましたが、最新のAngular CLIやAngularバージョンではまだ動作していません。
...そしてVS Codeはどうですか?
コメントでLiebster Kameradに感謝すると、VS Codeでブレークポイントを有効にする方法をここで見つけることができます質問はそのままにしておきます。次のアップデートで何とか解決することを期待しています。