検索
ホームページ開発ツールVSCodeVSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

VSCode でデバッグ環境を構成するにはどうすればよいですか?次の記事では、VSCode を使用して JavaScript ベースの Node.js デバッグ環境を構成する方法を紹介します。

VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

1. VSCode と Node.js をインストールする

序文: 科学的研究を行った後は、まれにまとめたり積み重ねたりすることで、科学研究で生じる問題の解決策はより多様で柔軟になるかもしれません。フロントエンド作業を行った後に環境構成を記録するためにブログを書く必要はもうありません。さて、くだらない話はやめて、テキストを始めましょう。

この記事で構成されている環境は、主に個々のJSファイルのブレークポイントデバッグ用で、主にLeetCodeのコードをデバッグするためです。

私の環境:

  • Visual Studio Code 1.66.0
  • Node.js 16.14.2
  • Windows10 64 ビット

VScode のダウンロードについては詳しく説明しませんが、主に Node のインストールを記録します (実際、これまでに何度もインストールしています)。 [推奨学習: vscode チュートリアル プログラミング教育 ]

  1. まず、公式 Web サイトにアクセスして、対応するバージョンをダウンロードします: https:// nodejs.org/ en/
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
  2. #インストールを開始すると、インストール パスをカスタマイズできます。
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
  3. ここで [パスの追加] を選択すると、システム変数は自動的に設定されますが、ユーザー変数は自動的に設定されず、必要に応じて手動で追加できます。
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
  4. インストールが成功したかどうかをテストします。コマンド ラインに node -vnpm -v を入力します。バージョン番号が表示された場合は、 、インストールは成功し、すでに正しい環境変数が設定されています。
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
    ユーザー変数を追加したことがないため、手動で追加する方が安全です。再起動すると問題は解決しますが、時々、node.js が VSCode でパスを見つけることができません。ただし、2 回再生した後, 常々違和感を感じていたので追加しましたが、インストール時に事前に追加しておくと良いでしょう。
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
  5. ##これで、Node.js のインストールは完了です

##2. VSCode の設定 #まず 2 つのプラグインを VSCode にインストールします。1 つは

Code Runner
    の実行を担当し、もう 1 つは JS 構文プロンプト
  1. JavaScript(ES6) コード スニペット を実行します。
    構成ファイルを作成し、コード フォルダーを開き、最初に test.js を作成し、いくつかのテスト コードを記述します。次に、左側のサイドバーにあるデバッグ ツールをクリックし、launch.json ファイルの作成を選択します。 VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

  2. node.js デバッグ環境を選択すると、画像内でテスト コードも使用できます。 VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

  3. このとき、設定ファイルが自動生成されますので、変更箇所に注意して、ここには書かないでください。現在デバッグされているファイルを識別できるように、VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。program
  4. 属性を
  5. ${file} に変更します。ここでファイル名を毎回変更する必要はありません。デバッグするには、F5 キーを押すだけです。ファイル。
    この時点で、実際の設定は完了です。このときのファイル構造は次のようになります。test.js ファイルに直接ブレークポイントを置き、F5 キーを押してデバッグすることができますVSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

  6. VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。
    VSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。

3. 考えられる問題 構成後に VSCode のデバッグを開始した場合実行が完了すると、次のエラーが報告されます: Unable パス上に実行可能なノードが見つかった場合、VSCode を再起動してデバッグしても問題ありません。

ちょっとした感動: 今年の秋の採用活動に向けて、フロントエンドの学習の旅が再び始まりました。仕事をうまくやりたいなら、まずツールを磨く必要があるので、環境の構成に関するブログを書き始めなければなりません。予想通り、次の記事は VSCode での Vue の構成に関する記事になります。インターンシップ中に書いたバンラケジの記事はあまり良くなかったので、もう一度見直して完成させなければなりません。テクノロジーの分野で働くことを選んだからには、それを地道に続けなければなりません。一つの仕事を愛せないなら、一つの仕事をし、一つの仕事をできるだけ愛さなければなりません、そしてラッシュ!

VSCode の詳細については、vscode 基本チュートリアル をご覧ください。

以上がVSCode の Node.js に基づいて JS デバッグ環境を構成する方法について説明します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事はcsdnで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。
Visual Studio:価格設定とライセンスオプションの探索Visual Studio:価格設定とライセンスオプションの探索Apr 13, 2025 am 12:03 AM

VisualStudioには3つのバージョンがあります:Community Free Editionは個人や小チーム向け、プロの有料版はプロの開発者と中小チーム向けであり、Enterprise Ultimate Editionは大企業と複雑なプロジェクト向けです。

Visual Studioの価値:その利点に対するコストを比較検討しますVisual Studioの価値:その利点に対するコストを比較検討しますApr 12, 2025 am 12:06 AM

VisualStudioは、強力で包括的であるため、.NET開発において非常に価値があります。高コストとリソースの消費にもかかわらず、それがもたらす効率の改善と開発の経験は重要です。コミュニティは、個々の開発者や小さなチームに最適です。大企業は、専門家や企業に適しています。

Visual Studioの可用性:どのエディションが無料ですか?Visual Studioの可用性:どのエディションが無料ですか?Apr 10, 2025 am 09:44 AM

VisualStudioの無料バージョンには、VisualStudioCommunityとVisualStudiocodeが含まれます。 1. VisualStudioCommunityは、個々の開発者、オープンソースプロジェクト、小規模チームに適しています。それは強力で、個々のプロジェクトや学習プログラミングに適しています。 2。VisualStudioCodeは、複数のプログラミング言語と拡張機能をサポートする軽量コードエディターです。スタートアップの速度と低いリソースの使用量が速いため、柔軟性とスケーラビリティが必要な開発者に適しています。

Windows 8用のVisual Studioをインストールする方法は?Windows 8用のVisual Studioをインストールする方法は?Apr 09, 2025 am 12:19 AM

Windows 8にVisualStudioをインストールする手順は次のとおりです。1。公式Microsoft WebサイトからVisualStudioCommunity2019インストールパッケージをダウンロードします。 2.インストーラーを実行し、必要なコンポーネントを選択します。 3.インストールが完了した後に使用できます。 Windows 8互換性のあるコンポーネントを選択し、十分なディスクスペースと管理者の権利があることを確認してください。

私のコンピュータはコードとコードを実行できますか?私のコンピュータはコードとコードを実行できますか?Apr 08, 2025 am 12:16 AM

VSCODEは、基本システムの要件が満たされている限り、ほとんどの最新のコンピューターで実行できます。1。オペレーティングシステム:Windows 7以降、MacOS 10.9以降、Linux。 2。プロセッサ:1.6GHz以下。 3。メモリ:少なくとも2GB RAM(4GB以上推奨); 4。ストレージスペース:少なくとも200MBの利用可能なスペース。設定を最適化し、拡張使用を削減することにより、低構成コンピューターでスムーズなユーザーエクスペリエンスを取得できます。

プログラムをWindows 8と互換性のあるものにするにはどうすればよいですか?プログラムをWindows 8と互換性のあるものにするにはどうすればよいですか?Apr 07, 2025 am 12:09 AM

Windows 8でプログラムをスムーズに実行するには、次の手順が必要です。1。互換性モードを使用して、コードを介してこのモードを検出して有効にします。 2. API呼び出しを調整し、Windowsバージョンに従って適切なAPIを選択します。 3.パフォーマンスの最適化を実行し、互換性モードの使用を避け、API呼び出しを最適化し、一般的なコントロールを使用してください。

VSコードはWindows 8で動作しますか?VSコードはWindows 8で動作しますか?Apr 06, 2025 am 12:13 AM

はい、vscodeisCompatibleWithWindows8.1)theinstallerfromthevscodesurethelatest.netframeworkisInstalled.2)installextensionsionsingTheCommandline、NotingSomeMayloadSlower.3)ManageByClusnnnnyRoightEntions、Light -omayloadSlower.3)

VSコードとVisual Studioの違いは何ですか?VSコードとVisual Studioの違いは何ですか?Apr 05, 2025 am 12:07 AM

VSCODEは、複数の言語と拡張機能に適した軽量コードエディターです。 VisualStudioは、主に.NET開発に使用される強力なIDEです。 1.VSCODEは電子に基づいており、クロスプラットフォームをサポートし、モナコエディターを使用します。 2。VisualStudioは、Microsoftの独立したテクノロジースタックを使用して、デバッグとコンパイラを統合します。 3.VSCODEは単純なタスクに適しており、VisualStudioは大規模なプロジェクトに適しています。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

SecLists

SecLists

SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

MantisBT

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティング サービスをチェックしてください。