/ How to

How to Open Multiple Folders in VS Code

Visual Studio Code (VS Code) is a popular code editor that allows you to work with multiple folders and projects efficiently. Here is a guide on how to open and manage multiple folders in VS Code.

Introduction

When working on complex software projects, you often need to work with code and files spread across multiple folders on your machine. For example, you may have:

  • A folder for your front-end code
  • Another folder containing back-end server code
  • Separate folders for tests, documentation, configurations etc.

Manually navigating between these folders as you work can be tedious and time-consuming.

Fortunately, VS Code has great support for multi-root workspaces that allow you to open and work with multiple folders in a single VS Code window.

Benefits of Multi-Root Workspaces

Here are some of the major benefits of using multi-root workspaces in VS Code:

  • Convenient access to all project folders – You can easily open, edit and switch between files spread across multiple folders in your workspace.
  • Integrated terminal – The VS Code integrated terminal allows you to seamlessly run commands and scripts located in the different folders in your workspace.
  • Search across folders – You can search for files and text across all folders in your workspace from the Search sidebar.
  • Shared workspace settings – You can have workspace-specific user and workspace settings that apply to all folders in the workspace.
  • Better version control integration – VS Code’s SCM providers like Git have better support for multi-root workspaces.

Opening Multiple Folders

Follow these simple steps to open multiple folders in a VS Code workspace:

  1. Open VS Code
  2. Click on File > Add Folder to Workspace
  3. Select the first folder you want to add
  4. Repeat steps 2 and 3 to add more folders
  5. All your folders now open in a single VS Code window!

Here are some other ways you can open multiple folders:

  • Drag and drop folders from File Explorer into the VS Code window
  • From the command palette, run Add Folder to Workspace command
  • Directly open a workspace configuration file (.code-workspace)

Managing Multiple Folders

Once you have multiple folders open in a workspace, here are some tips for managing them:

Switching Between Folders

Use the Explorer sidebar to quickly navigate between folders. You can expand a folder in the Explorer to open files within it.

Running Commands

The VS Code integrated terminal will automatically run commands in context of the currently active folder.

Searching Across Folders

Use the Search sidebar to quickly search across all files in all workspace folders. You can also scope the search to particular folders.

Customizing Per-Folder Settings

You can override editor settings like tab size, encoding etc. differently for each folder in the workspace by using Workspace Folder Settings.

Saving the Workspace

Once you have your workspace configured, save it as a .code-workspace file so you can easily reopen it later.

Conclusion

Multi-root workspaces provide a convenient way to work with multiple folders and projects in VS Code. They lead to improved productivity by reducing context switching across folders.

Try using a multi-root workspace for your next project with a complex folder structure spanning front-end, back-end and other code. Customize per-folder settings if needed and leverage VS Code’s excellent support for terminal, search and version control across all folders in the workspace.

Recommended Extensions

Here are some useful VS Code extensions for easier multi-folder workspace management:

Let me know in the comments if you have any other tips for working with multi-root workspaces in VS Code!

Related Posts