VSCode で JavaScript を実行する

Visual Studio Code で JavaScript を実行する (Japanese)

デバッグコンソールを使用する

• ステップ 6
  デバッグコンソールで JavaScript コードの実行結果を確認します。
• ステップ 5
  デバッグビューの緑色の再生ボタンをクリックして、デバッグを開始します。
• ステップ 4
  "Node.js" テンプレートを選択し、必要に応じて設定を調整します。
• ステップ 3
  "Add Configuration..." ボタンをクリックして、新しいデバッグ構成を作成します。
• ステップ 2
  デバッグビュー (通常はサイドバーの虫アイコン) に移動します。
• ステップ 1
  JavaScript ファイルを開きます。

ターミナルを使用する

• ステップ 3
  Node.jsの実行コマンド (通常は node filename.js) を入力して、コードを実行します。
• ステップ 2
  ターミナルで JavaScript ファイルのパスを入力し、Enterキーを押します。
• ステップ 1
  VSCodeのターミナルを開きます (メニューバーの "Terminal" > "New Terminal" を選択)。

タスクランナーを使用する

• ステップ 5
  タスクビューでタスクを実行します。
• ステップ 3
  "Create a new task" を選択し、"type" を "shell" に設定します。
• ステップ 2
  "Configure Task" ボタンをクリックして、新しいタスクを作成します。
• ステップ 1
  VSCodeのタスクビュー (通常はサイドバーのスクリュードライバーアイコン) に移動します。

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch",
            "program": "${workspaceFolder}/index.js"
        }
    ]
}

index.js ファイル:

console.log("Hello, world!");

console.log("Hello, world!");

ターミナルで実行:

node index.js

{
    "version": "2.0.0",
    "tasks": [
        {
            "type": "shell",
            "label": "Run JavaScript",
            "command": "node",
            "args": ["${file}"]
        }
    ]
}

タスクを実行:

• タスクビューで "Run JavaScript" タスクを選択して実行します。

これらの例では、以下のポイントに注意してください

• タスクランナー
  タスクビューで定義したタスクを実行することで、JavaScriptファイルを自動的に実行できます。
• ターミナル
  ターミナルで node コマンドを使用して、JavaScriptファイルを直接実行します。
• デバッグコンソール
  デバッグビューでデバッグを開始すると、デバッグコンソールに実行結果が表示されます。

コードランナー拡張

• 実行
  JavaScriptファイルを開き、右クリックして "Run Code" を選択するか、ショートカットキー (Ctrl+Alt+N) を使用します。
• インストール
  VSCodeの拡張機能マーケットプレイスから "Code Runner" 拡張をインストールします。

Node.js インタラクティブシェル

• 実行
  インタラクティブシェルで JavaScript コードを入力し、Enterキーを押します。
• 起動
  VSCodeのターミナルで node コマンドを実行します。

JavaScript REPL

• 実行
  拡張機能のアイコンをクリックして、REPLを開き、JavaScriptコードを入力します。

Webブラウザの開発者ツール

• 開く
  Webブラウザの開発者ツールを開きます (通常は F12 キー)。