Open a project in VS Code in a flash 📂⚡
Rob OLeary
Posted on July 18, 2022
The one thing that you do all the time with VS Code is open a folder. Wouldn't it be nice to find your project and open it in VS Code really quickly?
Let's look at how you can do that on the command-line, and inside VS Code.
On the command-line
I am going to create a custom shell command to create a dynamic menu to fuzzy find any folder on my system and open it with VS Code. I will call the command ocode
.
The video below demonstrates me opening the JavaScript project vscode-file-bunny.
It takes me 6 seconds to find and open the folder. I am trying to go more slowly to show you clearly in the video. I go faster normally! The real limit is your brain communicating with your fingers!
Let's walk through how I made this command!
I use the excellent fuzzy finding utility fzf
, and the file finder utility fd
. You must install both of these for the following to work, and they can be installed on any Operating System.
I prefer to use fd
over find
(typically pre-installed on Linux) because it is faster and respects .gitignore.
You can add the following to your .bashrc or .zshrc:
# choose a folder to open with vs code
ocode() {
folder=$(fd --type d --exclude node_modules | fzf)
if [ -n "$folder" ];
then
code $folder
fi
}
We use fd
to grab all of the folders, beginning from the current working directory, and exclude node_modules. We pipe this output to fzf
, which will present this input as an interactive menu. The if
statement checks that a selection was actually made, so we don't open vscode unnecessarily. The selection made is passed as an argument to code
, which is the command for vscode. And presto, it opens the folder.
For example, if I am in /home/rob/audiobooks, it will only look for folders inside audiobooks.
If you prefer the search to start in your home directory always, then you can use this command instead:
# choose a folder to open with vs code, always starts at home directory
ocode() {
folder=$(fd --type d --exclude node_modules . $HOME | fzf)
if [ -n "$folder" ];
then
code $folder
fi
}
Swap out $HOME
with another folder if you want to start from somewhere else.
In VS Code
To open a recent project is handled by VS Code. You can press Ctrl + R (or run the command File: Open Recent...
), and it will open your recently opened folders in the quickpick dropdown, as below.
You can type the name and hit Enter when you hit on a match to open it. It is quick!
What if you haven't opened a folder before?
If you are opening a new folder, it is slow. If you press Ctrl + O (or run the command File: Open Folder...
), you get a native file picker dialog to make your selection, as below. You need to click through to the location of the folder. 🖱️
In my case, the dialog starts in my desktop folder. All of my code project folders are in home/rob/programming/workspace, I have to click at least 5 times to get to a specific project folder!
I wrote an extension called File Bunny to help out with this. It has a command File Bunny: Open Folder
. The difference with this command is that you you can do everything with the keyboard in a quickpick dropdown. And you can choose the starting location!
This is what you get when you run the commmand:
Notice how it starts in home/rob/programming/workspace? 🙌
You can quickly get to the folder you want by building the path incrementally. It is easier to demonstrate with an example..
Again, I want to find the vscode-file-bunny project folder. I know it is contained below in my workspace, in js/vscode/vscode-file-bunny.
It takes me 10 seconds to find and open the folder with no clicking! Once you are familar, you can do it faster!
Here is a summary of what I did:
- I typed "j" and the js folder was the first option. I hit Enter to jump to that folder.
- I type "vs" and the vscode folder is the first option. I hit Enter to jump to that folder.
- I type "file" and the vscode-file-bunny folder is the first option. I hit Enter to jump to that folder.
- The first option is This Folder. I hit Enter and it opens the vscode-file-bunny folder.
In comparison to the ocode
command, it may seem a bit tedious, but I like this method a lot too. It is far better than a file dialog IMO!
You may ask, why don't I copy the behaviour of ocode
into the File Bunny extension?
It is possible, but I do not know if it is worth the effort to try to emulate it. You need a really good fuzzy finding library, and I do not know if there is Node library at the same level as fzf
.
Of course, you can just run the command ocode
in the integrated terminal! The only thing is that this will open a new window rather than open the folder in the current window.
Wrapping up
I love making improvements like this to my workflow. Any friction I can remove to get started on a task more quickly can help create momentum and foster a positive feeling. Finding and opening the right project is always a good start! 😅
Posted on July 18, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.