Rename a File, Folder or Workspace in Visual Studio Code

# Table of Contents

1. Rename a File or a Folder in Visual Studio Code
2. Rename a Workspace in Visual Studio Code
3. Rename multiple Files at once in Visual Studio Code

# Rename a File or a Folder in Visual Studio Code

The easiest way to rename a file or a folder in VS Code is to:

1. Right-click on the file or folder in Explorer.
2. Select Rename....
3. Give the file a new name and press Enter.

The same approach can be used to rename a folder. You simply have to right-click on the folder and select Rename....

Here is a short gif that demonstrates how to rename a file or a folder.

You can also use the F2 keyboard shortcut to rename a file or a folder.

Left-click on the file or folder in Explorer to select it and press F2.

Note that in order for you to rename a file or a folder, it has to be saved.

If you just created the file in VS Code, press Ctrl + Shift + S (or Cmd + Shift + S on macOS) to save it.

Once you press Ctrl + Shift + S a dialog opens and enables you to name the file.

Once the file is saved to your file system, you can rename it as shown in the previous examples.

You can also save the file by clicking on File -> Save as in the top menu.

Once you click File -> Save as, a dialogue opens and enables you to save and name the file.

You can also trigger the Save as action using the Command Palette:

1. Press:

• Ctrl + Shift + P on Windows and Linux.
• Command + Shift + P on macOS.

2. Type save as and select File: Save as....

If you need to rename multiple files at once in VS Code, click on the following subheading:

• Rename multiple Files at once in Visual Studio Code

# Rename a Workspace in Visual Studio Code

1. Press:

• Ctrl + Shift + P on Windows and Linux.
• Command + Shift + P on macOS.

2. Type save workspace and select Workspaces: Save Workspace As....

Once you select the option, a dialogue window opens and enables you to save your Workspace into a file.

You can give your workspace a different name and click on the Save button.

Alternatively, you can click on File in the top menu and then click Save Workspace As....

Note that you might have to press Alt on Windows and Linux to show the top menu.

If you already have a .code-workspace file in your project, you can rename it by right-clicking on it in Explorer and selecting Rename....

Once you click Rename..., give the file a new name and press Enter to confirm.

Alternatively, you can left-click on the .code-workspace file and press F2 to rename the workspace.

An alternative approach to rename a workspace is to edit your .code-workspace file and set a name property for each folder.

Copied!
{
  "folders": [
    {
      "path": "/path/to/folder",
      "name": "new folder name"
    }
  ],
  "settings": {}
}

The name property is used to set the display name for each folder in the workspace.

# Rename multiple Files at once in Visual Studio Code

If you need to rename multiple files at once in VS Code:

1. Click on Extensions in the left sidebar.

• You can also open the Extensions menu by pressing:
  • Ctrl + Shift + X on Windows or Linux.
  • Command + Shift + X on macOS.

2. Type Batch Rename.

3. Click on the Install button.

Make sure to install the Batch Rename extension from JannisX11 as shown in the screenshot.

Once the extension is installed:

1. Select the files you'd like to rename in Explorer.

You can select multiple files by holding Ctrl (Cmd on macOS) and clicking on them.

If the files are one after the other, you can also left-click on the first file, press Shift and left-click on the last file.

2. Once you've selected the files, right-click on one of them and click Batch Rename.

3. A new window opens where you can rename the multiple files at once.

4. Once you rename the files, save the .Batch Rename.txt file to complete the process.

Here is a short clip that demonstrates the process.

I've also written an article on how to rename/refactor a variable name in VS Code.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• VS Code: Hide specific Files/Folders from the Left Sidebar
• How to move a File to another Folder in VS Code
• VS Code: Remove Folder from Workspace open Multiple Folders
• What is the .vscode folder and should you Commit it to Git