2.5.2.3.2. Configuring an FTP and SFTP connection in VS Code

Attention!

Official Extension Remote - SSH requires installation and configuration of additional software on the server. Due to the technical features of hosting, such synchronization not supported.

You can organize synchronization using specialized extensions, for example SFTP from Natizyskunk. A detailed description of the extension and its capabilities is available at GitHub.

  1. Install the extension «SFTP» by Natizyskunk button «Install» on marketplace page or via the extensions section in VS Code:
  2. Open the extension’s configuration file — in the command palette, select «SFTP: Config» (the palette opens with a combination Ctrl+Shift+P on Windows/Linux or Cmd+Shift+P on macOS).
  3. Specify connection settings and save changes:
    {
        "name": "example",
        "host": "example.ftp.tools",
        "protocol": "ftp",
        "port": 21,
        "username": "example_ftp",
        "password": "password",
        "remotePath": "/",
        "uploadOnSave": true,
        "useTempFile": false,
        "ignore": [
            ".vscode"
        ]
    }

    Where:

    • name — arbitrary connection name.
    • hostFTP host.
    • usernameFTP login.
    • passwordFTP password.
    • remotePathrelative way from FTP access directory to the correct directory. Examples:
    • uploadOnSave - automatic synchronization when saving changes.
    • ignore — a list of files and directories that will be ignored when uploading the project to the server.
    {
        "name": "example",
        "host": "example.ftp.tools",
        "protocol": "sftp",
        "port": 22,
        "username": "example",
        "password": "password",
        "remotePath": "/home/example/",
        "uploadOnSave": true,
        "useTempFile": false,
        "openSsh": false
    }

    Where:

    • name — arbitrary connection name.
    • hostSSH host.
    • usernameSSH login.
    • passwordSSH password.
    • remotePathabsolute the path from the root of the server’s file system to the desired directory, where example - This hosting account name. Examples:
      • /home/example — access to the root directory of the hosting account.
      • /home/example/path/to/dir - access to a subdirectory path/to/dir within the hosting account.
    • uploadOnSave - automatic synchronization when saving changes.
    • ignore — a list of files and directories that will be ignored when uploading the project to the server.
  4. Connect to the server and download the content specified in remotePath directory to a directory on the local device - in the command palette, select «SFTP: Download Project» and the created connection.
  5. Wait for the download to complete - the status is displayed in the lower left corner of VS Code.

Further, after saving any changes in the local copy of the project, they will automatically be synchronized with the server. Also, through the context menu in the list of files, you can manually start synchronization in the right direction.

Content