【動作環境】
＜パソコン＞
機種：MacBook Air（13inch）
OS：macOS Sonoma（ver.14.6.1）
チップ：Apple M3
シェル：zsh
＜ソフトウェア＞
・Visual Studio Code（ver.1.96.4(Universal)）
本記事では、Visual Studio Code のインストール方法と初期設定方法について解説します。
Visual Studio Code とは
Visual Studio Code（以下、VS Code） は、HTMLやCSSの編集やプログラム開発、テキスト編集ができるテキストエディターです。
プログラマーが使用するイメージが強いですが、最近では原稿執筆を行うノンプログラマーにも使われています。
インストール手順
［Download for macOS］をクリックします。
zipファイルがダウンロードされます。
［Finder］を起動します。
［ダウンロード］フォルダにある［VSCode-darwin-universal.zip］をクリックします。
zipファイルをクリックすることで、解凍されます。
［Visual Studio Code.app］を［アプリケーション］フォルダにドラッグ＆ドロップします。
［開く］をクリックします。
VS Code の日本語化
VS Code を日本語表示に変更するためには、拡張機能を使います。
拡張機能とは、名前の通り機能を拡張する場所です。
つまり、VS Code に新たな機能を追加することができます。
1： アクティビティバーにある［拡張機能］をクリックします。
2： 検索ボックスに「japanese」と検索し、VS Code を日本語表示にしてくれる拡張機能を探します。
3： 「Japanese Language Pack for Visual Studio Code」という拡張機能が表示されたら、［installl］ボタンをクリックします。
5： インストールしたら、［Change Language and Restart］をクリックして、アプリを再起動します。すると、日本語表示になります。
スペース記号と改行記号の表示
半角スペースの表示
説明画像11
1： アクティビティバーにある［管理］をクリックします。
2： ［設定］をクリックします。
3： 検索ボックスの中に、「Render Whitespace」と入力します。
4： エディター全体の設定をする場合は［ユーザー］を選択し、作業ファイルの中のみの設定を行う場合は［ワークスペース］を選択します。
5： 表示方法を選択します。
| 設定値 | 説明 |
|---|---|
| none | 半角スペース記号を標示しません。 |
| boundary | 単語の間以外の半角スペース記号を表示します。単語間に2つ以上半角スペースが入った場合や行頭・行末に表示します。 |
| selection | テキストが選択されている場合のみ半角スペース記号を表示します。初期設定です |
| trailing | 末尾の半角スペース記号のみを表示します |
| all | 常に半角スペース記号を表示します |
設定が完了すると、以下のように半角スペースが「・」で表示されます。
全角スペースの表示
1： アクティビティバーの［拡張機能］をクリックします。
2： 検索ボックスに「zenkaku」と入力します。
3： ［zenkaku］を選択します。
4： ［インストール］をクリックします。
設定が完了すると、以下のように全角スペースがグレーで表示されます。
表示が変わらない場合は、以下の手順で有効化します。
1: 以下のボタンを押して、コマンドパレットを開く
コマンドパレットの開き方
Mac command ＋ shift ＋ P
Win Ctrl ＋ Shift ＋ P
2: 以下のように入力します。
Enable Zenkaku
すると、拡張機能が有効化され、全角部分に色がつきます。
改行記号の表示
1： アクティビティバーの［拡張機能］をクリックします。
2： 検索ボックスに「code-eol」と入力します。
3： ［code-eol］を選択します。
4： ［インストール］をクリックします。
設定が完了すると、以下のように改行されている箇所が矢印記号で表示されます。
これにて、VS Code のインストール方法と初期設定方法についての解説を終わります。
次は、ファイルとフォルダの基本操作について解説します。
参考書籍
コメント