To remove code preview in VS Code, you need to disable the "preview editor" functionality through its settings. This prevents files from opening in a temporary tab and ensures they open as permanent tabs immediately.
Understanding VS Code Preview Editors
When you single-click a file in the Explorer, open a file from Quick Open (Ctrl/Cmd+P), or click a search result, VS Code often opens it in a "preview editor." This is a temporary tab that gets replaced when you open another file in preview mode or when you double-click the current file to make it permanent. While useful for quickly browsing code, it can be disruptive if you prefer every file to open permanently.
Disabling Preview Editors Globally
You can disable preview editors for all scenarios by modifying a core VS Code setting.
Method 1: Using the Settings Editor (GUI)
-
Open Settings: In VS Code, go to
File
>Preferences
>Settings
(or pressCtrl+,
on Windows/Linux,Cmd+,
on macOS). -
Search for Preview: In the search bar at the top of the Settings tab, type
enablePreview
. -
Disable Global Preview: Locate the setting named
Workbench > Editor: Enable Preview
. Uncheck the box next to this setting.- Setting name in
settings.json
:workbench.editor.enablePreview
- Effect: When unchecked (
false
), files opened from the Explorer (single-click), search results, or other common actions will open as permanent tabs directly.
- Setting name in
Method 2: Editing settings.json
For users who prefer direct JSON editing:
-
Open
settings.json
: In VS Code, open the Command Palette (Ctrl+Shift+P
orCmd+Shift+P
) and typePreferences: Open User Settings (JSON)
. -
Add/Modify Setting: Add or modify the following line in your
settings.json
file:{ "workbench.editor.enablePreview": false }
-
Save File: Save the
settings.json
file. The changes will apply immediately.
Disabling Preview Editors from Quick Open
There's a separate setting to control preview behavior specifically when opening files via Quick Open (the file picker you get when pressing Ctrl+P
or Cmd+P
).
Method 1: Using the Settings Editor (GUI)
-
Open Settings: Go to
File
>Preferences
>Settings
(orCtrl+,
/Cmd+,
). -
Search for Quick Open Preview: In the search bar, type
enablePreviewFromQuickOpen
. -
Disable Quick Open Preview: Locate the setting named
Workbench > Editor: Enable Preview From Quick Open
. Uncheck the box next to this setting.- Setting name in
settings.json
:workbench.editor.enablePreviewFromQuickOpen
- Effect: When unchecked (
false
), files selected from the Quick Open (Ctrl+P
/Cmd+P
) list will open as permanent tabs instead of preview tabs.
- Setting name in
Method 2: Editing settings.json
-
Open
settings.json
: Open the Command Palette (Ctrl+Shift+P
/Cmd+Shift+P
) and typePreferences: Open User Settings (JSON)
. -
Add/Modify Setting: Add or modify the following line in your
settings.json
file:{ "workbench.editor.enablePreviewFromQuickOpen": false }
-
Save File: Save the
settings.json
file.
Summary of Preview Settings
To fully disable all preview editor behaviors, it's recommended to set both options to false
.
Setting Name (GUI) | settings.json Key |
Description | Recommended Value to Disable Preview |
---|---|---|---|
Workbench > Editor: Enable Preview | workbench.editor.enablePreview |
Controls preview editors globally for single-clicks in Explorer, search results, etc. | false |
Workbench > Editor: Enable Preview From Quick Open | workbench.editor.enablePreviewFromQuickOpen |
Controls preview editors specifically when opening files via Quick Open (Ctrl+P / Cmd+P ). |
false |
Alternative: Making a Preview Editor Permanent
Even with preview enabled, you can always make a preview tab permanent by:
- Double-clicking the file name in the Explorer.
- Double-clicking the tab itself.
- Editing the file (typing or pasting content often makes it permanent, depending on settings).
By adjusting these settings, you gain complete control over how files open in your VS Code workspace, ensuring a workflow that suits your preferences. For more details on VS Code settings, refer to the official documentation.