• Distrobox
  • Integrate VSCode and Distrobox
    • From distrobox
    • From flatpak
      • First step, install it
      • Second step, extensions
      • Third step, podman wrapper
    • Final Result

Integrate VSCode and Distrobox

VScode doesn’t need presentations, and it’s a powerful tool for development. You may want to use it, but how to handle the dualism between host and container?

In this experiment we will use VSCodium as an opensource alternative to VSCode. Dev Containers extension works only for non-opensource version of VS code. There are community made extensions like DevPod Containers that work in VSCodium

This guide has become outdated and you will need to expect that some things broke since then.

From distrobox

Well, you could just install VSCodium in your Distrobox of choice, and export it!

For example using an Arch Linux container (We use –home so to not clutter our home directory. You can change it if you have VSCode configuration in your home directory that you like):

~$ distrobox create --image archlinux:latest --name arch-distrobox --home ./devcontainer
~$ distrobox enter --name arch-distrobox
user@arch-distrobox:~$

Download the deb file HERE, or in Arch case just install

user@arch-distrobox:~$ sudo pacman -S code

Now that we have installed it, we can export it:

user@ubuntu-distrobox:~$ distrobox-export --app code

For proprietary version you need to use the binary hosted on AUR.

To enable and install from AUR do:

sudo pacman -Syu git base-devel &&\
git clone https://aur.archlinux.org/yay.git &&\
cd yay &&\
makepkg -si &&\
yay -S visual-studio-code-bin &&\
distrobox-export --app code

And that’s really it, you’ll have VSCode in your app list, and it will run from the Distrobox itself, so it will have access to all the software and tools inside it without problems.

Manage podman from Distrobox

We will use the podman-remote to manage our containers running on host

1. Install Dev Containers extension in VSCode
2. Make sure that podman sockets is enabled on the host system ` ls -l /run/user/$(id -u)/podman/podman.sock ` if it isn’t, enable it with: ` systemctl –user enable –now podman.socket `
3. Inside the Distrobox install podman to provide podman-remote ` sudo pacman -Syu podman `
4. Check if it’s working by running: ` podman-remote info `
5. Configure Dev Containers Extension by putting podman-remote in vscode://settings/dev.containers.dockerPath
6. If you click refresh in Dev Containers extension you should see your host’s containers

From flatpak

Alternatively you may want to install VSCode on your host. We will explore how to integrate VSCode installed via Flatpak with Distrobox.

For this one you’ll need to use VSCode from Microsoft, and not VSCodium, in order to have access to the remote containers extension.

First step install it

~$ flatpak install --user app/com.visualstudio.code 

Second step, extensions

Now we want to install VSCode Dev Containers extension

Third step podman wrapper

Being in a Flatpak, we will need access to host’s podman to be able to use the containers. Place this in your ~/.local/bin/podman-host In case of access to host’s docker to be able to use the containers, use ~/.local/bin/docker-host

For podman:

curl -s https://raw.githubusercontent.com/89luca89/distrobox/main/extras/podman-host -o ~/.local/bin/podman-host
chmod +x ~/.local/bin/podman-host

For docker:

curl -s https://raw.githubusercontent.com/89luca89/distrobox/main/extras/docker-host -o ~/.local/bin/docker-host
chmod +x ~/.local/bin/docker-host

Open VSCode settings (Ctrl+,) and head to Remote>Containers>Docker Path and set it to the path of /home/<your-user>/.local/bin/podman-host (or docker-host in case of docker), like in the example

This will give a way to execute host’s container manager from within the flatpak app.

Final Result

After that, we’re good to go! Open VSCode and Attach to Remote Container:

And let’s choose our Distrobox

And we’re good to go! We have our VSCode remote session inside our Distrobox container!

Open VSCode directly attached to our Distrobox

You may want to instead have a more direct way to launch your VSCode when you’re already in your project directory, in this case you can use vscode-distrobox script:

curl -s https://raw.githubusercontent.com/89luca89/distrobox/main/extras/vscode-distrobox -o ~/.local/bin/vscode-distrobox
chmod +x ~/.local/bin/vscode-distrobox

This will make it easy to launch VSCode attached to target distrobox, on a target path:

vscode-distrobox my-distrobox /path/to/project