Steve Kinney

Visual Studio Code

Creating Multi-Root Workspaces in Visual Studio Code

  1. Open Visual Studio Code: Launch Visual Studio Code.
  2. Close any open folder or workspace: If you have an existing folder or workspace open, close it by going to File > Close Folder or File > Close Workspace.
  3. Create an empty workspace: Go to File > Save Workspace As…. This will open a save dialog.
  4. Choose a location and name: Select a location on your file system where you want to save the workspace file. Give your workspace a descriptive name (e.g., my-complex-project.code-workspace). Visual Studio Code will save a file with the .code-workspace extension.
  5. Add folders to the workspace: Once the empty workspace is created, you’ll see an empty Explorer pane. To add folders, click on File > Add Folder to Workspace….
  6. Select folders: In the file dialog, navigate to and select the folders you want to include in your multi-root workspace. You can select multiple folders from different locations. Click Add.
  7. Save the workspace (if not already saved): If you haven’t saved the workspace yet, or if you’ve made changes, go to File > Save Workspace to save the current workspace configuration.

Anatomy of a .code-workspace

{
	"folders": [
		{
			"path": "path/to/folder1"
		},
		{
			"path": "path/to/folder2",
			"name": "Custom Folder Name"
		},
		{
			"uri": "git://repo-url?ref#folder-in-repo",
			"name": "Remote Repository Folder"
		}
	],
	"settings": {
		"editor.tabSize": 2,
		"files.autoSave": "afterDelay"
	},
	"extensions": {
		"recommendations": ["ms-vscode.vscode-typescript", "dbaeumer.vscode-eslint"]
	}
}

When we get into tasks and debugging, we’ll see that you can also define them in the .code-workspace as well.

Last modified on .