🤓

VSCodeでsshするわよ!

2022/06/07に公開

背景

VSCodeでsshできることは知っていたのですが,実際にやってみたことがなかったので試してみました.

環境

OS: macOS(intel)

拡張機能のインストール

sshを使うには拡張機能をインストールする必要があります.ありがたいことに方法が公式ドキュメントにありましたので,この通り進めていきます.

https://code.visualstudio.com/docs/remote/ssh

必要なのはRemote Developmentという拡張機能のみです.
ネットでぐぐってみるとRemote SSHという拡張機能をインストールしている記事が多かったのですが,Remote Development

Remote SSH
Remote Containers
Remote WSL

の3つの拡張機能も自動でインストールします.
そして,sshするのにはRemote SSHを使うのでどちらをインストールしても違いはありません.

https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.vscode-remote-extensionpack

ではインストールしていきます.VSCodeの拡張機能インストールのところを開いて,Remote Developmentと打ち込むと一番上に出てくるので,インストールボタンをポチります.

インストールすると

Remote SSH
Remote Containers
Remote WSL

の3つとも自動でインストール済になったのが確認できます.

リモートサーバーの準備

今回はAWSのEC2をssh先のリモートサーバーにしました.細かい設定などは割愛します.
EC2インスタンスを立てれたら,キーペアでsshできることを確認しておきます.

$ ssh ec2-user@x.x.x.x -i ~/.ssh/ec2-key.pem

またpemファイルは~/.sshの配下に移動させておきます

sshしてみる

VSCodeでCommand + Shiiift + pでコマンドパレットを開きます.
ssh newと入力して,Remote - SSH: Add new SSH Hostというサジェストで表示されるのをポチります.

sshするときのコマンドを入力してEnterを押します.

ssh ec2-user@x.x.x.x -i ~/.ssh/ec2-key.pem

次はどのssh設定ファイルを更新するのかを選択します.
だいたいの方は一番上の/Users/[ユーザー名]/.ssh/configを選択すると思います.

設定完了後,設定ファイルをみてみると,コマンドパレットで設定した内容が追記されていることがわかります.

~/.ssh/config
Host x.x.x.x
    HostName x.x.x.x
    User ec2-user
    IdentityFile ~/.ssh/ec2-key.pem

再びVSCodeに戻ってきてCommand + Shiiift + pでコマンドパレットを開き,remote ssh connectと入力し,一番上のRemote - SSH: Connect to Host ...をポチります.

するとssh先をどれにしますかというのが表示されるので,x.x.x.xを選択します.

新しいウィンドウが立ち上がって,ssh接続完了です.

フォルダをみると.vscode-serverというディレクトリが自動作成されるみたいです.

つまづくところもなく,簡単にできました.最近のVSCodeは何でも出来て素晴らしいですね!

株式会社ゆめみ

Discussion