Windows10 上の VScode から SSH 接続可能な Linux 環境上のファイルを編集できるようにする方法

タイトルのとおりメモ。

振る舞いとしては接続先環境で VScode を開いているのと同じようなものなので、 接続先環境のファイルを編集できるだけではなく、VScode 内のターミナルも接続先仕様となる。

環境情報

接続元 (Windows10)

# OS
C:\Users\local>ver

Microsoft Windows [Version 10.0.19042.804]

# ssh
C:\Users\local>ssh -V
OpenSSH_for_Windows_7.7p1, LibreSSL 2.6.5

# VScode
C:\Users\local>code -v
1.53.2
622cb03f7e070a9670c94bae1a45d78d7181fbd4
x64

# VScode extension (remote 関連)
C:\Users\local>code --list-extensions --show-versions
...
ms-vscode-remote.remote-containers@0.158.0
ms-vscode-remote.remote-ssh@0.64.0
ms-vscode-remote.remote-ssh-edit@0.64.0
ms-vscode-remote.remote-wsl@0.53.4
ms-vscode-remote.vscode-remote-extensionpack@0.20.0
...

接続先 (Linux: Fedora32)

# OS
[fedora@localhost ~]$ cat /etc/fedora-release
Fedora release 32 (Thirty Two)

# sshd
[fedora@localhost ~]$ rpm -qf $(which sshd)
openssh-server-8.3p1-3.fc32.x86_64

設定手順

以降、全て接続元の環境で行います。

1. 拡張機能のインストール

1. VScode を開く
2. Remote Development をインストールする
   

余談: コマンドラインでインストール

コマンドラインでインストールできるかやってみた。深い意味はない。 試した環境は Linux だがコマンドは同じなので、windows でも同様にできると考える。

[fedora@localhost ~]$ code -h
...
[fedora@localhost ~]$ code --install-extension ms-vscode-remote.vscode-remote-extensionpack
Installing extensions...
Installing extension 'ms-vscode-remote.vscode-remote-extensionpack' v0.20.0...
(node:272541) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc(), Buffer.allocUnsafe(), or Buffer.from() methods instead.
Extension 'ms-vscode-remote.vscode-remote-extensionpack' v0.20.0 was successfully installed.

以下は、code --list-extensions --show-versions の差分 (インストール前後)

  abusaidm.html-snippets@0.2.1
  auchenberg.vscode-browser-preview@0.7.0
  golang.go@0.22.1
+ ms-vscode-remote.remote-containers@0.158.0
+ ms-vscode-remote.remote-ssh@0.64.0
+ ms-vscode-remote.remote-ssh-edit@0.64.0
+ ms-vscode-remote.remote-wsl@0.53.4
+ ms-vscode-remote.vscode-remote-extensionpack@0.20.0
  oderwat.indent-rainbow@7.5.0
  rust-lang.rust@0.7.8
  syler.sass-indented@1.8.16
  vadimcn.vscode-lldb@1.6.1
  vscode-icons-team.vscode-icons@11.1.0

2. ssh コンフィグ設定

1. ~.ssh/config がないなら作成する
2. config を次のように定義する <> 内は環境ごとに異なる値

C:\Users\local\.ssh>type config
Host <任意の名前: 例) Fedora32>
    HostName <接続先ホスト名(IPアドレス)>
    User <接続先ユーザ名>

試す

1. 接続元環境で VScode を開く
2. Ctrl + Shift + P -> 「connect to host」と入力
   
3. config で設定した Host 名が表示されるので選択、押下。
   (あるいは VScode 上の左アイコン「Remote Explorer -> Host 名 -> Connect to Host in New Window」 から)
   
4. 新しい VScode が立ち上がり、パスワード入力を求められるので入力する
5. 接続先で VScode を開いているかのような感覚で操作が可能となる。
   次の画像は、接続先 (SSH:Fedora32) の / (ルート) を開いている例。