普段、自社のWebシステムなどを作る際には、WinSCPでサーバーのファイルを直接編集するなどで作業しています。

なんですが、どうせならVSCodeで直接繋げばいいやとなって設定したので、備忘録に残しておきます。

設定の流れ

自分はSFTP拡張機能を使いました。VSCodeにインストールしましょう。

Ctrl+Shift+Pでコマンドパレットを開き、「SFTP:Config」を呼び出します。

サーバーの設定情報を書き込みます（.vscode/sftp.json）。

“secure”: true がFTPsを使うためのポイントです。

{
    "name": "<好きな名前>",
    "host": "<サーバーアドレス>",
    "protocol": "ftp",
    "secure": true, //←これでTLS/SSLに対応する
    "port": 21,
    "username": "<ユーザー名>",
    "password": "<パスワード>",
    "remotePath": "/", //←初期表示するパス
    "uploadOnSave": true, //←編集したファイルを自動でアップロードするためにtrue
    "useTempFile": false,
    "openSsh": false
}

使い方

Ctrl+Shift+Pでコマンドパレットを開き、「SFTP:Explorer」を選択することで、プライマリ サイドバーにサーバーのディレクトリ・ファイルの一覧がツリー構造で表示されます。

まとめ

やってみて思ったのですが、VSCodeから離れないでサーバー側のファイルをいじれるのは思ったよりも快適でした。
今までなぜやらなかったんだろう(笑)

SSH接続の情報とかはいっぱいあるのですが、FTPsはちょっと珍しいかもですね。