VS Code: Multiple Project Folders

First, I couldn’t find a “VS Code” forum. If there’s a better place to post questions and issues with VS Code, please point me to it.

VS Code has an Explorer option to Add Folder to Workspace.

I take that to mean that I can have multiple projects available in VS Code simultaneously, but when I choose the option then open a new folder nothing appears in the VS Code window indicating that the second folder is open . . . not in the Explorer window nor in the workspace tabs.

I’ve searched and found articles saying that it’s possible to have 2 folders open and available and that they should appear as tabs in the workspace, but that doesn’t happen for me.

I suspect that there is a VS Code setting that I need to adjust but I can find nothing searching or using AI that tells me how to do what I want.

Is it possible to have 2 project folders open at the same time in VS Code? If so, how do I do it?

Yes, it’s possible to have multiple folders (i.e. projects) open at the same time in VS Code.

To do this:

  • First, open your main folder using File > Open Folder…
  • Then, go to File > Add Folder to Workspace… and select the second project folder.
  • You should now see both folders listed separately in the Explorer pane, each with its own root.
1 Like

Thanks, James.

I’ve tried that and the Explorer pane didn’t show the 2nd folder and associated files.

I had the same problem, and found that Ctrl + Shift + N (windows) or Cmd + Shift + N (mac) opened a new window in VS Code. So I could work on 2 different windows simultaneously and/or 2 different project. Handy shortcut…

1 Like

I’ll give that a try.

I think there might be a bit of confusion here.

There’s no need to open separate instances of VS Code to work on multiple projects — though that’s a perfectly valid option if it suits your workflow. However, if you want to work with two or more folders in the same window, what you actually need is a workspace, which is essentially just a container for one or more folders and a few shared settings.

This workspace can be temporary — something you throw together and discard — or you can save it for reuse later. It’s entirely up to you. The key is that VS Code needs to switch from “single-folder mode” into “workspace mode” to show both folders in the Explorer.

Here’s how to do it from scratch:

  1. Open an empty VS Code window (File → New Window).
  2. Go to File → Add Folder to Workspace… and select your first project folder.
  3. Repeat Add Folder to Workspace… and add your second project folder.
  4. You’ll now see both folders listed separately in the Explorer.
  5. If you want to keep this setup, go to File → Save Workspace As… and save it somewhere as a .code-workspace file.

I ran through these steps myself and have included a screenshot so you can see exactly what it looks like.

2 Likes

That’s the solution I was looking for but couldn’t find.

Thank you, James.

1 Like

Glad that helped :slightly_smiling_face:

Workspaces can be a bit unintuitive at first, but once you get the hang of them, they’re super useful.

I must still be doing something wrong (very likely), or there is a problem with the VS Code install (unlikely).

From VS Code with the Search option in the workspace title bar, I click on File > Add Folder to Workspace then navigate to my folder, select it then click Add. I get this screen:

Note that there are not any folders or files shown in the Explorer pane and the main window title bar contains “Untitled (Workspace)”. I expected to see the name of the folder in the title bar and the folder name and the files within it shown in the Explorer pane.

To add to my confusion, there was a time when I was using VS Code several months ago when the Explorer pane would display folder names with the files contained in them in a manner similar to Windows File Explorer. Now I can no longer see the folder names. I found it helpful to have a main folder for my project and subfolders within it for Styles (to contain CSS files), JS (to contain Javascript files) and to have separate HTML files for my home page (index.html) and for each page on my website. AI says that the default is for VS Code to show the folder names a la Windows File Explorer.

To my knowledge, I have changed no settings that would affect the way folders and files are displayed in the VS Code Explorer pane. I have no clue why I cannot use the “Add Folder to Workspace” as described above and have the selected folder and its files appear in the title bar and the Explorer Pane.

The VS Code settings that I recall changing are: 1) set the default browser to Chrome; 2) stop the Welcome file from appearing each time I open something. I do have 4 extensions installed: Cobalt 2 theme; Colorful Comments; Live Server (by Ritwick Dey); and Prettier. I have not yet tried uninstalling the extensions to see if they are affecting the Explorer pane display of folder names and the “Add Folder to Workspace” results.

Further adding to my confusion (which is not difficult), when I have selected a folder using “Add Folder to Workspace” then used File > Open Folder, I see the folder name I selected and added in the title bar but none of the files or subfolders within it appear in the Explorer Pane.

Finally, I’ve searched for a user forum dedicated to VS Code where I might ask questions. I’ve not found one that accepts newbie questions like mine. I hate to waste bandwidth at Sitepoint with such questions if there is a forum dedicated that purpose. If anyone can provide me a link, I will be much obliged.

From what you’ve posted, it looks like the workspace is still empty. The Explorer pane only shows “OPEN EDITORS” and “TIMELINE”, which is what you’d see when no folders have been added at all. So despite adding a folder via “Add Folder to Workspace…”, it’s not showing up — meaning either the folder wasn’t added properly, or VS Code didn’t register it for some reason.

Let’s go through it step by step, just to rule out any confusion. After each step, let me know what you see — that way we can pinpoint where things go sideways.

Note: I’m using Cursor, which is a fork of VS Code, but it behaves the same way when it comes to workspaces. If you still can’t get it to work after we go through the steps together, I’ll install vanilla VS Code just to double-check there’s no discrepancy.

Open a blank VS Code window
Go to File → New Window. This ensures you’re not in single-folder mode.
You should see something like this:

Open the Explorer
If the sidebar is collapsed or hidden, hit Ctrl+B to toggle it. You should see a section called EXPLORER on the left.

Add your folders
Now go to File → Add Folder to Workspace… and select a project folder (e.g., folder-a). Repeat to add a second folder (e.g., folder-b).

Check the Explorer
You should now see both folders listed by name under EXPLORER.

If not, try clicking the … menu in the EXPLORER pane and select “Refresh” or “Collapse All” to reset the view. In Cursor (what I’m using), those buttons are next to the workspace title.


Let me know what happens after step 3 or 4 and feel free to post another screenshot if it’s still not showing anything.

1 Like

Thanks for your patient help, James.

Here is how I proceeded.

  1. VS Code had a folder open; so I chose File > Close Folder and got this screen.
  2. I selected File > Add Folder to Workspace and got this screen then clicked the folder to highlight it and chose Select Folder
    and got this screen.

    Note that there’s no Explorer pane or folder name in the title bar.
  3. I then clicked the Explorer icon selector in the left margin and got this screen.
    Note that, again, there are not folder or file names in the Explorer Pane and the title bar shows Untitled (Workspace).
  4. Next, I clicked File > Add Folder to Workspace for the second time and selected the same folder name and got the message shown in this screen.

    I chose to Save the workspace
  5. After saving the workspace, this screen appeared showing my filenames but not the folder name.

To add to my previous post about VSC settings changes, I did change a setting to save files automatically. It doesn’t seem to be working, however, as I see the panel reminding that there are unsaved files; so I’m trying to develop the habit of clicking the “Save All Files” icon when I see that message.

Hmmm. Based on your screenshots, something is definitely going wrong between selecting the folder and it appearing in the Explorer.

After you clicked Select Folder, you should have seen that folder (HutchinsClan) appear under UNTITLED (WORKSPACE) in the Explorer pane. The Explorer staying empty is not expected behavior.

To help narrow it down, could you do the following:

Create a folder directly on your Desktop, call it something like TestProject. Then open a blank window in VS Code, go to File → Add Folder to Workspace…, and select the TestProject folder. Once you’ve done that, take a screenshot of what you see in the Explorer.

This will help check whether the issue is specific to your external drive, the HutchinsClan folder, or something else entirely like permissions or corrupted settings.

P.S. I’ve just installed a vanilla version of VS Code and everything worked exactly as I described earlier. The only thing that stood out was a prompt asking whether I trust the folders I added.

Is it possible that you previously selected “Don’t Trust” or “Never Trust” for that external drive. If so, VS Code will silently block access and won’t show folder contents in the Explorer.

To check this press Ctrl+Shift+P, then type and select: “Workspace: Manage Workspace Trust”

That’ll show your current trust settings. Please include a screen shot of that screen.

This is what it looks like for me:

Here is the screen:

And, anticipating your response, here is the screen resulting from clicking the “Configure your settings” link.

Shame. Worth a try though…

Can you also try what I suggested in post#13, namely:

Here are the TestProject results.

First, after “Add Folder to Workspace” there is no Explorer pane:

I then clicked the Open Explorer icon in the left margin and got this screen:

The TestProject folder doesn’t appear in the Explorer pane or the title bar.

I then tried again to Add Folder to Workspace with the same result. I then tried File > Open Folder and selected TestProject from my desktop. I got this prompt:

I chose not to save the workspace (because I saw no benefit to the process) and again clicked File > Open Folder and chose TestProject and finally got a screen with the folder name in the title bar.

FWIW: Here’s a ss of Help > About showing the VSC version:

Another anomaly I’ve noticed is that after opening a project, for the first time that I try to “Open with Live Server” nothing happens but repeating the choices displays the file in Chrome as it should.

Thanks for the detailed follow-up. You’ve done everything right, but something’s clearly misfiring in your setup.

As a next step, make sure VS Code is closed, then open the Windows Command Prompt and run:

code --disable-extensions

That will launch VS Code with no extensions loaded.

Then try adding the TestProject folder again using File → Add Folder to Workspace…. as described in post#13.

Let’s see if the folder shows up correctly when extensions are out of the picture. If it works, then we know one of the extensions is the culprit.

Thank, James. I truly appreciate your patience and persistence in helping me.

I did as you suggested and entered the disabling command in a Windows command prompt screen, but I closed VS Code first. Upon completion it opened VS Code, which I wasn’t expecting. It opened VS Code to the same file I was editing before I closed VSC to make the Command Prompt entry. I then closed that folder and VS Code. Next I opened VS Code and chose Add Folder to Workspace and selected the desktop TestProject folder to open. VS Code didn’t change as the screenshot shows.

I think I’m going to see if downloading a fresh copy of VS Code then uninstallling the existing copy using Windows Settings > Apps THEN reinstalling the freshly downloaded copy. I’ve done this before but results were not as expected in that I still had extensions installed and settings that didn’t fall back to defaults.

What do you think?

Hi, that felt a little scattered, so I’m not completely sure the test went as intended. From what you described, it doesn’t sound like VS Code was actually running in no-extensions mode when you tried adding the folder.

Would you mind giving it another go? First make sure that no instance of VS Code is running. Then open a Windows terminal and run:

code --disable-extensions

That will launch VS Code with all extensions temporarily disabled. From that window, try File → Add Folder to Workspace… and select your TestProject folder again. Then let me know how that goes.

Also, in your earlier screenshot, I noticed a “10K” badge on the Git icon in the sidebar. That means VS Code sees over 10,000 changes in the current workspace. If that’s not expected, it could be slowing things down or causing weird side effects. Worth double-checking what’s being tracked there.

OK. To be certain that VS Code was not running, I opened Windows Task Manager where I found a VS Code task active. I ended the task; so it should not be possible for VSC to be actively running.

Then I opened a command prompt window and changed the directory to the root directory (just to be sure there was no extraneous issue) before entering “code --disable-extensions” and pressing Enter.

Again, immediately upon the completion of the command, my screen flashed up this VS Code screen:

Content displayed is from what I was last editing before ending the VSC task in Task Manager. Note that a message says that all installed extensions are temporarily disabled.

I think I have taken care of the git icon issue. I have updated my git repos albeit from a Windows PS prompt, not from within VSC. I have not yet incorporated updating repos from VSC into my skill set and mode of operating. I find it better to make a specific, conscious effort to use git from a command line.

What do you think of the idea of a fresh install?