リモートサーバー上のコードをVSCodeで直接編集したいとき、「Remote - SSH」拡張機能を使えば簡単に設定できます。この記事では、その手順を初心者向けにわかりやすく解説します。
目次
📌 前提条件
- VSCodeがインストールされていること。
- SSHでリモートサーバーにアクセスできること（公開鍵認証またはパスワード認証）。
- インターネット接続があること。
📖 手順
1. 「Remote - SSH」拡張機能をインストール
- VSCodeを起動します。
- 左側の「拡張機能」アイコン（四角が飛び出すマーク）をクリックします。
- 検索バーに「Remote - SSH」と入力。
- Microsoft製の「Remote - SSH」拡張機能をインストールします。
2. SSH設定ファイルの準備
SSH接続には、~/.ssh/configファイルを使用します。この設定ファイルでリモートサーバーへの接続を定義します。
- ターミナルを開き、以下のコマンドを実行して設定ファイルを作成または編集します:
nano ~/.ssh/config
- 以下のように、リモートサーバーの情報を記述します:
Host my-remote-server
HostName 192.168.1.100 # サーバーのIPまたはホスト名
User my-username # リモートサーバーのユーザー名
IdentityFile ~/.ssh/id_rsa # SSH鍵のパス（鍵認証を使用する場合）- ファイルを保存して閉じます。
💡 ヒント: Hostの値（例: my-remote-server）は任意の名前でOK。後で接続時にこの名前を使用します。
3. リモートサーバーに接続
- VSCode左下の緑色の「リモートアイコン」をクリック。
- 「Connect to Host」を選択。
- 先ほど設定したエイリアス名（例:
my-remote-server）を選択。 - 初回接続時に「このホストのSSHキーを信頼するか」と聞かれるので「Yes」を選択。
リモートサーバーに接続されると、VSCodeのウィンドウが再起動し、リモート環境として動作します。
4. リモートフォルダを開く
接続後、リモートサーバー上の作業ディレクトリを開きます。
- 左側のエクスプローラーで「Open Folder」をクリック。
- リモートサーバー上のディレクトリ（例:
/home/my-username/project）を選択。
これで、リモートサーバー上のコードがVSCodeで編集可能になります！
5. リモート環境での開発
- リモート環境に必要な拡張機能（例: Python、Node.js関連）をインストールする際は、「Install in SSH: [Host名]」を選択してください。
- ターミナルを開くには、
Ctrl + ``（バッククォート）を押します。リモートサーバーのターミナルが利用できます。
🛠 トラブルシューティング
Q1. SSH接続エラーが発生する
- SSH設定ファイル（
~/.ssh/config）の記述を再確認。 - ターミナルで以下を実行してSSH接続が可能か確認:
ssh my-remote-server
Q2. 拡張機能がインストールされない
- 拡張機能画面で「Install in SSH」を選択しているか確認。
Q3. 権限エラーが発生
- リモートサーバー上のファイル・フォルダの権限設定を確認します:
chmod -R u+w /path/to/directory
これで、リモートサーバーでの開発作業が快適になるはずです！
VSCodeと「Remote - SSH」を使って、効率的なリモート開発を楽しんでください。