web-dev-qa-db-ja.com

Visual Studio 2017のJavascriptブレークポイント

Visual Studio 2017をインストールしました。ASP.NETMVCアプリケーションを起動した後、Visual Studioでchromeデバッグが有効になっているというメッセージが表示されます。

しかし、Visual Studioでのブレークポイントはヒットしません。 Razorコードのブレークポイントは機能しているようですが、Javascriptは機能していません。ブレークポイントは、本来のように完全に赤ではありません。再起動、再構築は効果がないようです。

私は次のコード例を持っています

@Html.Partial("_Test", Model.Test) // debugging works here

<script>
    var i = 1;
    console.log(i); // debugging does not work here or above
</script>

@section scripts {
    <script>
        var a = 11;
        console.log(a); // debugging does not work here or above
    </script>
}

chromeデバッグコンソールを開いていないので、Visual Studioのオプション（「Javascriptデバッグを有効にする」）をオンにします。

このブログ投稿によると、これは機能するはずだと思いました： https://blogs.msdn.Microsoft.com/webdev/2016/11/21/client-side-debugging-of-asp-net-projects-in -google-chrome /

ここに何かが足りませんか？ Visual Studio 2017でこれが何らかの形で機能していない可能性がありますか？

拡張機能は1つしかなく、Resharperですが、これは問題ではないと思います。

javascriptvisual-studiovisual-studio-2017
35
ronaldm

この機能は、*。cshtmlファイル内のjavascriptコードでは機能せず、個別の* .js（または* .ts）ファイルのコードでのみ機能します。

enter image description here JavaScriptファイルのブレークポイントはアクティブですが、Razorビューのブレークポイントはアクティブではないことに注意してください。

また、現在のChromeセッションでページが初めて読み込まれるときに、ページの読み込み中にJavaScriptコードが実行されると、JavaScriptファイルのブレークポイントにヒットしないことに気付きました。ブレークポイントは、ドキュメントの読み込みが1回終了した後にのみ機能します。

26
NineBerry

別のヒント：js debugは、実行/デバッグで「開始URL」を設定した後にのみ有効にできます。

この方法でのみ、VSはブラウザプロセスにアタッチします。

24
Lw Cui

同じ問題がありました。同じ投稿の指示に従いました： https://blogs.msdn.Microsoft.com/webdev/2016/11/21/client-side-debugging-of-asp-net-projects-in-google -chrome /

Visual Studioで次のことを行いました：Tools-> Options-> Debugging-> Generalに移動し、「ASP.NETのJavaScriptデバッグを有効にする（ ChromeとIE）」。変更を保存してから、Webページを実行します。

この後、ページをロードする前にChromeが「デバッグWebページ」を表示していないことに気付きました。次に、Webページを閉じて、デバッグセッションを停止しました。

「ASP.NETのJavascriptデバッグを有効にする（ChromeおよびIE）」オプションを再度有効にした後、IEを使用してWebページを実行すると動作しました。ページが停止し、ブレークポイントがビジュアルスタジオに表示されました。

13
Luis Art Guerra

私は同じ問題を抱えていました。スクリプトの上部：

<script>
  debugger;

  -- rest of your jscript here
</script>
9
s1cart3r

「ASP.NETのJavascriptデバッグを有効にする（ChromeおよびIE）」オプションを有効にし、デバッガーを設定した場合のみ、2017年と比較して機能します。 * .cshtmlおよび* .jsファイルのjsコードで

4
user1599615

これを機能させるための唯一の方法はインストーラーを使用してVisual Studio 2017で修復を行うことだと考えた後、BundleTable.EnableOptimizations = true;にBundle.configがあることに気付きました。この行を削除してWeb.Debug.config変換に追加すると、期待どおりに機能し始めました。

1
Froman
  • Visual Studio Professional 2017バージョン15.8.1
  • Chromeバージョン68.0.3440.106（公式ビルド）（64ビット）

以下の場合、レガシーChrome JavaScriptデバッガーを有効にする必要がありました。

オプション->ツール->デバッグ->全般->レガシーChrome JavaScriptデバッガーをASP.NET用に有効化

0
Sanny Jacobsson

あなたが試すことができる2つのオプション：

  1. VSオプションで[ASP.NETのJavaScriptデバッグを有効にする（ChromeおよびIE）]をオフにしてから、ブラウザーでデバッガー（F12）を使用します。
  2. Visual Studioでデバッグを開始し、Solution Explorer -> Internet Explorer -> <your view name>にブレークポイントを追加します。 （IEを使用していると仮定）
0
Phil Haselden

Google Chrome Portableを使用している（またはブラウザのデバッグリストにchromeを手動で追加した）場合、これが役立ちます。

https://docs.Microsoft.com/en-us/visualstudio/javascript/tutorial-nodejs-with-react-and-jsx?view=vs-2017#set-and-hit-a-breakpoint- in-the-client-side-react-code

次に、適切なchromeインスタンスに手動でアタッチする必要があります

0
amarax

ここでの最良の推測は（少なくとも私の場合は、場合によってはあなたの場合も）、バンドルに関係しているということです。私が現在取り組んでいるプロジェクトは、個別のスクリプトを1つのBig Daddyスクリプトにバンドルしています（デバッグ構成で縮小することなく）ので、VSはブラウザで実行される究極のスクリプトにブレークポイントをマップしません。

これは単なるごまかしなので質問に答えないことはわかっていますが、正しい方向に向けられることを望んでいます。他の人の経験に対してこれを検証できれば、本当の答えになるかもしれません。

0
John VanZwieten