VSCode + Dev Containers and Toolbx/Distrobox setup for Fedora Silverblue

Instructions.md

VSCode + Dev Containers and Toolbx/Distrobox setup for Fedora Silverblue

PLEASE NOTE:

I personally don't use Flatpak VSCode anymore, since I switched from Fedora Silverblue to Universal Blue's project Bluefin-DX. I'll leave the instructions here for those who want them, but be aware that Flatpak VSCode instructions won't be maintained anymore.

Steps

If you prefer VSCode Flatpak

1. Install VSCode Flatpak from Flathub:

flatpak remote-add --if-not-exists flathub https://dl.flathub.org/repo/flathub.flatpakrepo
flatpak install com.visualstudio.code

2. Prepare it for spawning podman from host system:

mkdir -p ${HOME}/.var/app/com.visualstudio.code/data/node_modules/bin
ln -sf /app/bin/host-spawn ${HOME}/.var/app/com.visualstudio.code/data/node_modules/bin/podman

3. Inject some environment variables (if you want to use work with Toolbx/Distrobox containers):

flatpak --user override --env HOST_DISPLAY="$DISPLAY" --env HOST_SHELL="$SHELL" --env HOST_SSH_AUTH_SOCK="$SSH_AUTH_SOCK" com.visualsudio.code

If you prefer layered VSCode (RPM)

1. Add VSCode repository info to your system:

echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com/yumrepos/vscode\nenabled=1\ngpgcheck=1\ngpgkey=https://packages.microsoft.com/keys/microsoft.asc" | sudo tee /etc/yum.repos.d/vscode.repo > /dev/null

2. Install code package:

rpm-ostree install code

3. Reboot your system:

systemctl reboot

Preparing your VSCode for working with containers

1. Install Dev Containers extension.
2. Configure Dev Containers > Docker path property (dev.containers.dockerPath) to podman.

If you want to work with Dev Containers

1. (For both VSCode Flatpak and layered installations) Create config file ${HOME}/.config/containers/containers.conf with the following contents:

[containers]
env = ["BUILDAH_FORMAT=docker"]
label = false
userns = "keep-id"

1.1. Alternatively, these parameters can be set per-devcontainer (WARNING: it may break combatibility with Docker. You may be unable to open it in a Docker-based cloud DE such as GitHub Codespaces or GitPod.). Include the following in your project's devcontainer.json file:

{
  ...
  "runArgs": [
    "--userns=keep-id",
    "--security-opt=label=disable"
  ],
  "build": {
    "options": [
      "--format=docker"
    ]
  },
  ...
}

2. (For both VSCode Flatpak and layered installations) in your project's devcontainer.json file, you must set properties remoteUser and containerUser properly. For example, if you use any base image from Microsoft itself, you must set both properties to vscode.

3. (For VSCode Flatpak only) Give write permission to /tmp directory:

flatpak --user override --filesystem=/tmp com.visualstudio.code

If you want to work with Toolbx/Distrobox containers

In the following, replace ${XDG_CONFIG_HOME} with ${HOME}/.config (for layered VSCode) or ${HOME}/.var/app/com.visualstudio.code/config (for VSCode Flatpak).

1. Create file ${XDG_CONFIG_HOME}/Code/User/globalStorage/ms-vscode-remote.remote-containers/nameConfigs/${YOUR_DISTROBOX_CONTAINER_NAME}.json with the folloing minimal contents:

{
  "remoteUser": "${localEnv:USER}",
  "settings": {
    "dev.containers.copyGitConfig": false,
    "dev.containers.gitCredentialHelperConfigLocation": "none"
  },

  "terminal.integrated.profiles.linux": {
    "distrobox": {
      "path": "${localEnv:SHELL}",
      "args": [
        "-l"
      ]
    },
    "toolbx": {
      "path": "/usr/sbin/capsh",
      "args": [
        "--caps=",
        "--",
        "-c",
        "exec \"\$@\"",
        "/bin/sh",
        "${localEnv:SHELL}",
        "-l"
      ]
    }
  },
  "terminal.integrated.defaultProfile.linux": "distrobox", // Replace with "toolbx" if you're using it

  "remoteEnv": {
    "COLORTERM": "${localEnv:COLORTERM}",
    "DBUS_SESSION_BUS_ADDRESS": "${localEnv:DBUS_SESSION_BUS_ADDRESS}",
    "DESKTOP_SESSION": "${localEnv:DESKTOP_SESSION}",
    "DISPLAY": "${localEnv:DISPLAY}", // Replace with ${localEnv:HOST_DISPLAY} for Flatpak
    "LANG": "${localEnv:LANG}",
    "SHELL": "${localEnv:SHELL}", // Replace with ${localEnv:HOST_SHELL} for Flatpak
    "SSH_AUTH_SOCK": "${localEnv:SSH_AUTH_SOCK}", // Replace with ${localEnv:HOST_SSH_AUTH_SOCK} for Flatpak
    "TERM": "${localEnv:TERM}",
    "VTE_VERSION": "${localEnv:VTE_VERSION}",
    "XDG_CURRENT_DESKTOP": "${localEnv:XDG_CURRENT_DESKTOP}",
    "XDG_DATA_DIRS": "${localEnv:XDG_DATA_DIRS}",
    "XDG_MENU_PREFIX": "${localEnv:XDG_MENU_PREFIX}",
    "XDG_RUNTIME_DIR": "${localEnv:XDG_RUNTIME_DIR}",
    "XDG_SESSION_DESKTOP": "${localEnv:XDG_SESSION_DESKTOP}",
    "XDG_SESSION_TYPE": "${localEnv:XDG_SESSION_TYPE}"
  }
}

2. Create a folder inside your container for vscode-server data:

sudo mkdir /.vscode-server
sudo chown ${USER}:${USER} /.vscode-server
ln -sf /.vscode-server ${HOME}/.vscode-server
sudo chmod 755 /root
sudo ln -sf /.vscode-server /root/.vscode-server

Related projects

• https://github.com/owtaylor/toolbox-vscode
• https://github.com/daw1012345/vscode-for-toolbox

Hi,
Very nice ! First time I read a ready to use tutorial with functional flatpak vs code, distrobox container access in user mode, and git synchronisation. Thank you so much !!

PS. For Kinoite/KDE users, as of Dec 1st 2024, to get git authentication, you should also add to the file ${HOME}/.vscode/argv.json the code
"password-store": "gnome-libsecret"

@lbssousa Did you found any downsides when using both docker format and keep-id as default options?

I'm thinking of enable these as well, since most of my containers follow this.

@lbssousa Did you found any downsides when using both docker format and keep-id as default options?

I'm thinking of enable these as well, since most of my containers follow this.

I've updated the instructions with an alternative approach, setting these paremeters per-devcontainer. I personally use them globally, to ensure compatibility with Docker.

@lbssousa Hi, do you experience disconnection from the Container each time vs code should reload or refresh the workspace ? For example after extension installation. I get a "Shell server terminated (code: 137, signal: null)" error.
To (temporary) solve the issue, I have to stop & re-enter the distrobox container.
This error exists both with your configuration or Lucas89's one.
OS: Bazzite Gnome, VS Code Flatpak, Container Arch

Thank you so much!

I spent so much time trying to get the flatpak to hook into my pods, let alone the distrobox, to no avail. But, this did the trick.

When Bazzite GDX drops this pain will be no longer and future users can rest easy

Thanks so much for this!

I have one suggested tweak to your instructions: there wasn't a connection between my folder on the host OS and the folder inside the container until I started the podman service as a user by typing this command:

systemctl --user enable --now podman.socket

This is unexpected. These instructions should work without Podman socket-activated service at all.