LoginSignup
42
53

More than 3 years have passed since last update.

Visual Studio CodeでLinux ホストリモート開発

Last updated at Posted at 2019-07-28

Windows端末からVisual Studio Codeを使って、Linux上での開発が可能なRemote Development拡張機能の使い方。なお、Remote Development拡張機能でインストールされるRemote - SSHを使用。Remote - SSHだけを単独でインストールしても問題なし。

SSH環境設定

OpenSSH互換クライアントのインストール

Windows 10 1809以降であれば、WindowsのOpenSSH互換クライアントが利用可能。
PowerShellを管理者として実行し、下記のコマンドでインストール状態を確認できる。

PS C:\> Get-WindowsCapability -Online | ? Name -like 'OpenSSH.Client*'

Name  : OpenSSH.Client~~~~0.0.1.0
State : Installed

StateがInstalledになっていれば、既にインストールされている。NotPresentなら未インストールなので、下記のコマンドでインストール。

PS C:\> Add-WindowsCapability -Online -Name OpenSSH.Client~~~~0.0.1.0

Path          :
Online        : True
RestartNeeded : False

ssh鍵設定

公開鍵認証でLinuxサーバにssh接続できるように設定を行う。

Windows端末で鍵の作成

Windows端末のコマンドプロンプトで下記のコマンドを実行する。3回問い合わせがあるが、何も入れずにEnterを押せばOK。

C:\> ssh-keygen -t rsa -b 4096

Linuxサーバに作成した公開鍵をコピー

Windows端末のコマンドプロンプトから下記を実行。

# 接続先のLinuxサーバのユーザ、IPの設定
C:\> SET REMOTEHOST=[ユーザ名]@[host名 or IPアドレス]

# ssh公開鍵のコピー
C:\> scp %USERPROFILE%\.ssh\id_rsa.pub %REMOTEHOST%:~/tmp.pub
C:\> ssh %REMOTEHOST% "mkdir -p ~/.ssh && chmod 700 ~/.ssh && cat ~/tmp.pub >> ~/.ssh/authorized_keys && chmod 600 ~/.ssh/authorized_keys && rm -f ~/tmp.pub"

ssh公開鍵認証での接続確認

Windows端末のコマンドプロンプトから下記を実行し、ssh公開鍵を使用してinuxサーバにログインできることを確認。

C:\> ssh -i %USERPROFILE%\.ssh\id_rsa %REMOTEHOST%

Visual Studio Codeのインストール

Visual Studio Code 1.35以降をインストール

Remote Development拡張機能パックのインストール

  1. Visual Studio Codeを起動
  2. 画面左側の"Extension"ボタンをクリック or Ctrl+Shift+Xを実行
  3. Remote Developmentを検索
  4. Installをクリックし、インストール

VS_Code_Install_Remote_Development.png

Visual Studio CodeからLinuxサーバでの作業

Linuxサーバへ接続

F1キーを押し、コマンドパレットにRemote-SSHと入力し、Run Remote-SSH: Connect to Host...を実行する。"Select configured SSH host or enter user@host"画面が表示されるので、[ユーザ名]@[host名 or IPアドレス]を入力する。

VS_Code_run_remote_ssh.png

新しいVisual Studio Codeが起動される。初回はLinuxサーバのセットアップが行われるので、しばらく待つ。画面左下にSSH: ホスト名が表示されれば、接続成功。

VS_Code_run_remote_ssh2.png

なお、コマンドパレットからRemote-SSH: Connect Current Window to Host...を実行すると、現在実行中のVisual Studio CodeでLinuxサーバに接続できる。

また、コマンドパレットからRemote-SSH: Open Configuration File...を選択し、configファイルにLinuxサーバ情報を記載すると、Linux接続時にリストから選択できるようになるので便利。

# configファイル入力例
Host 接続先サーバ名(リストに表示される)
    HostName ホスト名 or IPアドレス
    User ユーザ名

Linuxサーバ上のファイルを編集

File -> Open FileでLinuxサーバ上のファイルを開いて自由に編集できる。

Linuxサーバのターミナル操作

Ctrl + @でターミナル画面を表示すると、接続しているLinuxのターミナル画面が表示される。TeraTerm等のssh client不要で、VS Codeだけで一通りの作業ができる。

参考リンク

Remote Development拡張パックインストール

Remote Development using SSH

接続先サーバの要件

Remote Development with Linux

42
53
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
42
53