This commit is contained in:
Nebel 2022-06-08 16:24:45 +09:00
parent aa94168a7e
commit 292439f466
2 changed files with 11 additions and 11 deletions

View file

@ -16,16 +16,16 @@ VSCodeでNode.jsのプログラムのデバッグを行うには、Auto Attach (
自動アタッチを行うにはVSCode内のターミナルを使用しなければなりません。
また、Auto Attachを有効にした後、ターミナルを一度再起動する必要があります。これは、ターミナルの右上にある ⚠ アイコンをクリックするか、新しいターミナルを作成することで行えます (3)。
![自動アタッチ設定](assets/nodejs-auto-attach.dio.png)
![](assets/nodejs-auto-attach.dio.png)
_自動アタッチ設定_
_自動アタッチ設定_
## ブレークポイント
Node.jsで実行するプログラムのコードをVSCodeで開き、行番号の左の部分をクリックしてブレークポイントを作成できます。
また、もう一度その部分をクリックすることでそのブレークポイントを削除できます。
![ブレークポイントの作成](assets/nodejs-breakpoint.png)
![](assets/nodejs-breakpoint.png)
_ブレークポイントの作成_
@ -41,7 +41,7 @@ _ブレークポイントの作成_
$ node hello.js
```
![Node.jsのデバッグ](assets/nodejs-debugger.png)
![](assets/nodejs-debugger.png)
_Node.jsのデバッグ_

View file

@ -6,9 +6,9 @@ VSCodeは、標準で備えている機能の他にMarketplaceにある拡張機
VSCodeを起動して、ウィンドウの左端のアクティビティバーにある「拡張機能」をクリックして、Marketplaceにある拡張機能を検索することができます。
![ESLintのインストール](assets/installing-eslint-vscode.png)
![](assets/installing-eslint-vscode.png)
_ESLintのインストール_
_ESLintの拡張機能のインストール_
## 便利な拡張機能の紹介
@ -26,7 +26,7 @@ _ESLintのインストール_
![ESLintの使用](assets/vscode-eslint-error.png)
_ESLintの使用_
_ESLintの拡張機能の使用_
このようにESLintの拡張機能をインストールすることによって自動的にESLintを実行し、即時にJavaScriptのコードのチェックを行うことができます。
@ -37,9 +37,9 @@ _ESLintの使用_
Prettierの拡張機能をインストールすることによって、VSCodeの編集画面に表示されるコードを自動的に整形することができます。
Marketplaceに「Prettier - Code formatter」という名前で提供されています。これをインストールします。
![Prettier](assets/installing-prettier-vscode.png)
![](assets/installing-prettier-vscode.png)
_Prettier_
_Prettierの拡張機能のインストール_
インストール後、ファイルを開き、`Ctrl`+`Shift`+`P` (macOSの場合は`Cmd`+`Shift`+`P`)を押して、コマンドパレットを開きます。そのなかに
@ -73,9 +73,9 @@ _Prettier_
VolarはVueでの開発に必要な拡張機能です。
![Volar](assets/installing-volar-vscode.png)
![](assets/installing-volar-vscode.png)
_Volar_
_Volarのインストール_
Vueとはユーザーインターフェイスを構築するためのJavaScriptフレームワークです。