Remote development using Visual Studio Code

Visual Studio Code is a code editor developed by Microsoft available for Linux, macOS and Windows. The editor supports several useful features for code development, such as attaching and editing files on a remote system over SSH. This guide will show you how to run an instance of Visual Studio Code on your local machine and attach to a C3SE system for remote development or debugging.

The instructions below assumes you already have Visual Studio Code installed and have a working SSH login to one of our systems.

Note that the instructions belows is for running Visual Studio Code on your local computer.

Prerequisite: Install the Remote-SSH extension

Your installation of Visual Studio Code might not include the extension needed for remote development. You can check if you have the Remote - SSH extension installed by pressing F1 and searching for "Remote SSH". If nothing shows up you are likely missing it. The instructions belows shows you how to install the Remote - SSH extension.

1) Click on Extension (or press Ctrl+Shift+X) and search the Marketplace for "Remote SSH".

2) Select the Remote - SSH extension and click on install. The installation should only take a few seconds.


Remote attaching to a system

1) Open the Command Palette under View, or press F1, and search for "Remote SSH".

2) Select Remote - SSH: Add New SSH Host

3) Fill in the SSH command as suggested by Visual Studio Code. You must at least include a username (CID) and the hostname of the login node. If you want to connect to Alvis you would enter:

$ ssh <CID>

4) You will be prompted to select a SSH configuration file (if you are using one).

5) The remote host should now be available. Click on the Remote Explorer button and right click on the remote host and select Connect to Host in Current Window. If everything goes well we can now start to work remotely from Visual Studio Code.

6) Move to the Explorer and select the Open Folder. Pick the default suggested folder (which should be your home directory).

7) You should now see the files in your home directory.

Save often: When editing files remotely make it a habit to you save your work frequently to minimize the risk of losing changes due to broken connections, crashes or login node reboots.

remote illustration

Import a SSH configuration file

If you are already using an SSH configuration file you can import the configuration file in the Remote SSH extension and instantly make all your SSH endpoints (including options) available in the Remote Explorer.

1) Press F1 and search for "Remote-SSH: Open SSH Configuration File..."

2) Select your SSH configuration file.

The default SSH configuraiton file for OpenSSH is ~/.ssh/config on macOS, Linux and WSL, and %programdata%\ssh\sshd_config on native Windows.

Observe that if you have specified an SSH configuration file and use the Remote SSH extension to add a new SSH host, the configuration file will get updated with the new host. If you enter the same host as already defined you will get an duplicate entry.

Attaching to a particular environment

For productivity and development purposes you might want to load a particular environment when you remote attach using Visual Studio Code. This can be done by updating your .bash_profile, as seen in the example below.

# VS-code remote session:
if [ -n "$VSCODE_IPC_HOOK_CLI" ]; then
    module load fosscuda/2020b TensorFlow/2.4.1

The above snippet looks for the environment variable $VSCODE_IPC_HOOK_CLI, which should be exclusive to the Visual Studio Code remote session, and loads TensorFlow.