Chromeデバッグツールをきれいなコードでデバッグするにはどうすればよいですか？
かなりのコードを使用し、「プリティコード」タブにブレークポイントを設定しましたが、デバッガーは縮小されたコードで動作し続けます。 （現在の場所が正確にわからないため、ソースコードと「きれいなコード」を継続的に切り替える必要があります）。同じスクリプトを使用した同じページでは、動作する場合と動作しない場合があります。原因を特定できないか、アクティブ化の方法に違いが見つかりません。
デバッガに「きれいなコード」を使用させる方法はありますか？アイデアや追加の質問はありますか？これをバグとして報告する必要がありますか？
編集：私はまだ何が起こっているのか理解していませんが、それに対する修正があります。そのため、この状況が発生した場合は、スクリプトを編集して「デバッガー」を追加するだけです。カーソルの後のキーワード。ブレークポイントを作成します。その後、「きれいなコード」を使用すると、デバッガーはプリティコード内にとどまります。私が言ったように、私はなぜこれが起こっているのか理解していないので、私はまだ答えを待っています。
編集：現在のブラウザのバージョンは42.0.2311.135（64ビット）です。
編集：デイブは、非常によく似たものにバグが報告されていることを指摘しました。 https://code.google.com/p/chromium/issues/detail?id=415406 ファイルサイズに関連していると言われていますが、確認できません。これらの発見を反映してタイトルを変更しました。
これをバグと呼ぶことができます。あなたはそれをディレマと呼ぶことができます。
2013年8月9日のオープンチケット（Chrome v。28）
Bug Reporterの観察
私はこれをデバッグするのに少し時間を費やし、devtoolsをローカルで開発する方法に慣れてきました。これらのすべてが役立つかどうかはわかりませんが、これまでに見てきたことといくつかの難点の概要を以下に示します。
元の.jsファイルにブレークポイントを添付すると、UIが混乱しているように見え、sourceMapアソシエーションごとに関連する.coffeeまたは.tsファイルにブレークポイントを割り当てます[添付されている画像-1を参照]
ただし、ブレークポイントのチェックを外して無効にすると、UIが正しく更新され、ブレークポイントが.jsファイルの適切な場所に表示されます。 [添付の画像-2を参照]
WebInspector.CompilerScriptMapping.rawLocationToUILocationまたはWebInspector.CompilerScriptMapping.uiLocationToRawLocationで誤ったルックアップが発生しているように思われます
2014年9月21日からのオープンチケット（Chrome v。37）
Chromium開発者の観察
これは簡単に解決できるものではありません。ブレークポイントマネージャは、ソースマップの場合はコンパイルされていないソースである「最良の」UIロケーションに常にブレークポイントが表示されるという考えに基づいて構築されています。これを修正するには、ブレークポイントのプライマリUIロケーションを、それを表示する場所のヒントとして使用する必要があります。さらに、デフォルトでは、コンパイルされていないソースに実行行が表示されるため、それらのブレークポイントも表示し続けることが不可欠です。したがって、これはすべて、同時にいくつかのuiの場所にブレークポイント（および実行行）を表示する必要があります。これらの場所でのすべてのアクションはスムーズに機能する必要があります。
これは大きな努力であり、私にとって「GoodFirstBug」のようには聞こえません。
結論：
Prettifyは、縮小されていない新しいバージョンを作成しないようです。むしろレンダリングされます。意味あり。さまざまなフレームワークとフレーバー（コーヒーなど）を使用すると、デバッガーが新しいファイルを作成した場合、エラーが発生する可能性が高くなります。
ブレークポイントマネージャは、ソースマップの場合はコンパイルされていないソースである「最良の」UIロケーションに常にブレークポイントが表示されるという考えに基づいて構築されています。
これは、Chromeブラウザーとデバッガーが縮小版から実行を継続することを意味します。「きれいな」ファイルにブレークポイントを設定すると、デバッガーは縮小ファイルに設定し、開発者に、縮小されたファイルをステップ実行するデバッガーの「きれいな」レンダリングを提供します。
これはデバッガーが管理するのに非常に多く、かなり壊れやすい場合があります。これをバグまたは非常に野心的な機能と呼ぶことができ、多くの問題が発生する可能性があります。
**
このスレッドを両方のバグに追加し、両方の開発者に割り当てられたメールを送信しました。
**
ChromeとSafariでは、[スクリプト]タブを選択し、関連するファイルを見つけて、下部パネルにある[{}]（きれいな印刷）アイコンを押します。
これはどうですか？：「min」バージョンのプリティプリントバージョンを生成し、「min」バージョン名を使用して保存します：「min」をプリティ「1」に置き換えます
一番下のパネルにある「{}」（きれいな印刷）アイコンをクリックし、元のファイルの ソースマップ を付加せずにブレークポイントを設定しているようです。
.mapファイルを指定すると、Chrome devツールを実行し、.mapファイル内のデータを使用して、実行された縮小コードの各行を元のソースファイルにマッピングします。縮小したファイルを/フォーマットします。
Grunt uglifyなどを使用してjsを縮小すると、デバッグ用のマップファイルが自動的に生成されます。これを行う方法の詳細については、次のリンクを参照してください。