Note: I’d recommend having basic knowledge and experience with Docker before continuing with this article.
If you have setup your project to run inside containers, you may notice that your coding experience isn’t the same as before anymore: IntelliSense doesn’t work anymore as your code is in host machine but your libraries, packages are insider container.
Basically you can bring back that experience but you need to install libraries, packages,… which will consume more space of your computer and it’s just like running your code on host machine.
Lucky for us, VS Code (Visual Studio Code) has extension from Microsoft to solve this issue: Remote Development. In this article I will show you how to setup and use the extension to bring back the old “coding experience”.
Pre-requisites
- Visual Studio Code, of course
- Remote Development and Remote-Containers extensions
- Optional: other extensions you’ve used or find suitable
Setup and run
- Make sure container is running
- Go to Settings (Ctrl/Cmd + ,)
- Search for
Remote — Containers, locate theDefault Extensions
- In here you can specify the extensions to be installed in the container. The value to be added can be retrieved in extension detail page.
- Click on Remote Explorer icon on the left side bar, locate your container , hover on it and click on the folder-with-+ icon.
- A new VS Code window will open, connect to the container. You will see a notification on the right bottom corner, click on
detailsand you will see the output log. First it will install the list of extensions you added in Settings. Once finished you will be prompted to choose a folder to open, which should be the one containing your code base.
- From now on you can code and have a similar experience like coding on host machine like before. Once finished you can close connection by clicking on
Attached Containeron the left bottom corner of VS Code →Close Remote Connection.
Thanks for ready and happy coding :).
- The post is originally from my Medium: dienbui.medium.com/code-inside-docker-conta..
- Cover image is from code.visualstudio.com/opengraphimg/opengrap..