20

次のような JavaScript コードがあるとします。

function breakpointInside() { console.log("How do I add a breakpoint here?"); }
breakpointInside();

ソースファイルを編集できないとします。をデバッグしたいbreakpointInsideのですが、行の途中にブレークポイントを追加する方法がわかりません。この例では、関数にステップ インするのは簡単ですが、これが実際的ではないより複雑なスクリプトであると仮定します。

4

3 に答える 3

18

ここに2つの関連するソリューションがあります

1) ソースの難読化解除

行内にブレークポイントを配置することはできませんが、(新しいバージョンの Chrome では) スクリプトを右クリックして を選択しDe-obfuscate Source、難読化を解除したバージョンにブレークポイントを配置することができます (各行に 1 つのステートメントが含まれます)。 .

2)プリティプリント

（ニコラスのコメントに基づく）

Chromium ベースのブラウザのそれ以降のバージョンでは、この機能は「プリティ プリント」と呼ばれ、ソース コード パネルの左下にある次のようなボタンとして使用できます。{}

于 2011-08-06T07:30:59.580 に答える
4

Chrome DevTools ライブでソースを編集できます。[スクリプト] パネルでソースをダブルクリックし、console.log の前に改行を追加するだけです。Ctrl+Enter または Ctrl+S を押して、変更を仮想マシンにコミットします。次に、console.log を含む新しい行にブレークポイントを設定します。

于 2011-08-06T18:22:49.910 に答える
3

Nicolas Boisteault によるコメントは、最新バージョンの chrome で使用されるものです。

2015 年には、左下にある pretty print という {} ボタンをクリックできます。– ニコラ・ボイストー

于 2016-02-04T19:32:50.500 に答える