Vueを有効にします.生産モードのJS devtools.

TLDR最新版:
AS
コメントに記載されている-私はここで説明したものを自動化するために使用できるクロム拡張子“Vue force dev”があります.
時々、我々は生産で何かをデバッグする必要があります.しかし、Vueで.devtoolsを無効にして配備された場合、メッセージが表示されます.

現在、あなたのdev環境でバグを再現することができないなら、デバッグするPITAです.
しかし、“それは単なるJavaScript”-我々は“メインフレームをハック”簡単にできます.私たちがしなければならないのは、Vueがロードされ、一つのオプションを上書きする場所を見つけることです.

Vue.config.devtools = true

ほとんどのバンドルは、ソースファイルからコメントを残します.

 * Vue.js v2.6.11
 * (c) 2014-2019 Evan You
 * Released under the MIT License.
 */

クロムdevtoolsのすべてのソースを検索するには、ドットをクリックし、searchを選択します.

いいえ、単に“Vue . js”を検索するための正確なバージョンをコピーするには、正しい行を取得する必要がありますほとんどの時間.以下のようになります.

この行にブレークポイントを設定し、ページを再読み込みします.それがすべてのミニ化され、1行であれば、次の関数呼び出し(F 10/CMD ')以上のステップで、その最後にジャンプする必要があります.Minifiedでない場合、Vueコードブロック全体の後にブレークポイントを設定する必要があります.
今私たちのスコープの変数を見てVueオブジェクトを見つける必要があります.Webpack Vueでは、このようなものをエクスポートする必要があります.

我々の場合では、オブジェクトexportsのプロパティtが我々のVueオブジェクトであることがわかります.
コンソールに移動し、dev56toolsをtrueで上書きします.

私たちのブレークポイントを削除することができますランタイム再開-それはそれだ!ちょうど開発者のツールを閉じて、再び我々のVUEタブを利用できるように開いてください!
解決策は、あなたのセットアップに基づいて変更することがあります場合は、それに問題がある場合、私はポストに詳細情報を追加することがありますコメントしてください.
❤️