vscode でコードをデバッグする方法

王林
リリース: 2019-12-12 17:42:42
オリジナル
7154 人が閲覧しました

vscode でコードをデバッグする方法

最初に拡張デバッグ プラグインをインストールしますdebugger for chrome

vscode でコードをデバッグする方法

Ladybug ボタンをクリックしてデバッグしますプロジェクトの構成で、構成ボタンをクリックします。

vscode でコードをデバッグする方法

#Chrome 環境を選択します

vscode でコードをデバッグする方法

##Chrome デバッグ構成ファイル launch.json が表示されます。ポップアップが表示され、変更します。 ポートは

vscode でコードをデバッグする方法

#lauch.json 構成ファイルが生成されていない場合は、次の方法で構成ファイルを開くこともできます。 [構成の追加] を選択します。

vscode でコードをデバッグする方法

次に、[Chrome] を選択します。ポートを起動して変更します。

vscode でコードをデバッグする方法

プロジェクトを開き、ctrl ` [ を使用します。 ` が Tab キー上にあることに注意してください] ngserve と入力してプロジェクトを開始します

vscode でコードをデバッグする方法

とてんとう虫インターフェイスに切り替えます。たとえば、app.component にブレークを設定します。 .ts

vscode でコードをデバッグする方法

をクリックしてデバッグ ボタンを開始すると、ブラウザ ページが自動的にポップアップ表示されます。

vscode でコードをデバッグする方法

ページにアクセスすると、プログラムが実行されていることがわかります。

vscode でコードをデバッグする方法

# ブレークポイントの場所で、変数を表示したり、例外をキャプチャしたり、コール スタックやその他のデバッグを行うことができます。

おすすめの関連記事とチュートリアル:

vscode チュートリアル

以上がvscode でコードをデバッグする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート