How to open settings json vscode

Areg Sarkissian

September 28, 2020 by Areg Sarkissian

In this post I will describe how I customize and use the Visual Studio Code (VSCode) editor for a more productive development experience.

Most of my setup is based on excellent resources by others on this topic. I will provide links to those resources at the end of this post.

Before I go through my setup, it will help to detail how VSCode settings and keyboard shortcuts are configured, which I will describe in the following sections.

VSCode settings files

The default VSCode settings are listed in a defaultSetttings.json file. This file is readonly and can not be directly modified.

The settings in the defaultSetttings.json file can be overridden by user settings in a settings.json file. This is a VSCode User settings file that is located at

/Library/Application Support/Code/User/settings.json on my MacBook.

On a Mac, all VSCode user configuration files are located in the

/Library/Application Support/Code/User/ directory.

To override a setting from the defaultSetttings.json file, all we need to do is manually copy that setting into our settings.json file and set its value to what we want.

Also, when we change settings using the VSCode menu, VSCode adds the setting we changed to the settings.json file with the changed value. After that, any time we update the setting using the VSCode menu, VSCode will update the value of the setting in the settings.json file. Conversely, opening up the settings.json file and updating a setting manually, will get reflected in the VSCode menu.

There can also be a per workspace directory settings.json file that can override both the Global (defaultSettings.json) and User (settings.json) file settings.

A workspace is the root directory in the VSCode explorer which is the directory from which VSCode is launched. For example if we cd into a directory named

VSCode keyboard shortcut settings files

The VSCode keyboard shortcut settings work in a similar way as the VSCode editor settings.

There is a global defaultKeyboardSettings.json file located in the VSCode installation location that is readonly. There is a user keyboardSettings.json file located at

There is no per workspace keyboard shortcut settings file.

Accessing the JSON settings files

Now that we know how to configure settings using the VSCode JSON settings files, I will describe how to access those files to make your changes.

To open the JSON settings files use the cmd+sh+p keyboard shortcut to open the global command palette dropdown and type the word settings in the search box. This will show options for selecting settings files that have the text (JSON) in their description.

Select the defaultSetttings.json or setttings.json option to open the respective settings file. Use the defaultSetttings.json file settings as a reference to copy settings you want to modify to the setttings.json file.

Similarly, to open the keyboard shortcut settings files, type the word keyboard in the global command palette. This will show options for selecting keyboard settings files, that have the text (JSON) in their description.

Select the defaultKeyboardSetttings.json or keyboardSetttings.json option to open the respective settings file. Use the defaultKeyboardSetttings.json file settings as a reference to copy settings you want to modify to the keyboardSetttings.json file.

Steps to setup my VSCode preferences

In each of the following sections I show how I customize a particular section of the editor

Moving search results panel from side panel to bottom panel

The first thing I do after installing VSCode is move the location of the search results panel from the side panel to the bottom panel.

Unfortunately there is no settings option to change the location so we must resort to dragging the search icon from the side panel activity bar to the bottom panel tab area.

If the bottom panel is not visible select cmd+j keyboard shortcut to open it.

After moving the search panel to the bottom panel, set its tab position in the bottom panel tab area by sliding the search tab to your desired position.

Note: There may be a search.location setting in the defaultSetttings.json but it is deprecated and the related comments in the settings file suggest using drag and drop to change the file search panel location.

Moving and hiding file explorer side panel sections

Open the file explorer side panel using the file explorer activity bar icon or by pressing the cmd+sh+e keyboard shortcut.

Collapse all the sections in the explorer side panel.

Drag the open editors section, in the file explorer side panel, down to the last position at the bottom. This way the files section will become the topmost section in the file explorer side panel.

Now whenever the open editors section is open, it won’t move the files section that used to be located below it, up and down as you open and close files or as you collapse/expand the open editors section.

After this I actually like to hide all the sections except the files and timelines sections.

To do that, right click anywhere in file explorer panel or click on the dropdown menu button in the upper right corner of the file explorer panel to bring up menu options for hiding and showing the panel sections.

Hiding the status and activity bars

Right click on status bar to popup a context menu that will allow you to hide the status bar. Alternatively select view > appearance > show status bar to uncheck the status bar menu item.

Right click on activity bar to popup a context menu that will allow you to hide the activity bar. Alternatively select view > appearance > show activity bar to uncheck the activity bar menu item.

Note: By hiding the activity bar, you will be forced to use the VSCOde view menu or keyboard shortcuts to open the side panels. See the section Shortcuts for opening\closing activity side panels below for the keyboard shortcuts to open, close and toggle commonly used side panels.

Overriding VSCode default settings

To override the VSCode default settings, I select cmd+sh+p keys then type in the text settings in the search box. This brings up the Preferreces: Open Settings (JSON) selection, which I select to open the user

/Library/Application Support/Code/User/settings.json file.

Then I add the following override settings to the settings.json file:

Overriding VSCode default keyboard shortcuts

To override the VSCode default settings, you can select cmd+sh+p keyboard shortcut and then type in the text keyboard in the search box. This brings up the Preferreces: Open Keyboard shortcuts (JSON) selection, which you can select to open the user

/Library/Application Support/Code/User/keyboardSettings.json file.

You can configure keyboard shortcuts by adding settings to the keyboardSettings.json file to override the default VSCode settings in the defaultKeyboardSettings.json file.

Commonly used keyboard shortcuts

For everyday use, the keyboard shortcuts listed in the following sections can boost your productivity.

Shortcuts for opening\closing activity side panels

Open\Close toggle last selected side panel cmd+b

Open file explorer panel / toggle focus when panel is open (closes the current open panel) cmd+sh+e (use cmd+b to close panel)

Open debugger panel / toggle focus when panel is open (closes the current open panel) cmd+sh+d (use cmd+b to close panel)

Open git panel / toggle focus when panel is open (closes the current open panel) ctrl+sh+g (use cmd+b to close panel)

Open extensions panel / toggle focus when panel is open (closes the current open panel) cmd+sh+x (use cmd+b to close panel)

Shortcuts for opening\closing bottom panels

Open\Close toggle current tab of bottom panel cmd+j

Open\Close toggle terminal tab in bottom panel ‘ctrl+`’ (ctrl+backtick)

Open search in files tab in bottom panel cmd+sh+f (use cmd+j to close panel)

Note: The ‘search in files’ panel tab was dragged from its default side panel location to the bottom panel

Shortcuts for navigation drop downs

Open ‘search for files’ by name dropdown cmd+p

Open ‘Command Palette’ dropdown cmd+sh+p

Other useful shortcuts

toggle comment line(s)

Find in current File

close current file

Save current file

Save all modified files

Open VSCode configuration settings UI

Close various panels

Editing with multiple cursors

Hold the option key down and click the mouse cursor two or more locations to spawn multiple persistent cursors at those locations. Then release the option key.

Then when you type characters, they will appear at all cursor locations.

Hit escape or click anywhere to change to single cursor at that location.

VS Code. How to open JSON settings with defaults

When I’m opening settings using Preferences: Open Settings (JSON) I’m getting screen like this:

But in VSCode videos/tutorials I see people somehow have splitted window, with default settings on the left and user/workspace setting on the right:

How I can enable it?

EDIT:

3 Answers 3

Trending sort

Trending sort is based off of the default sorting method — by highest score — but it boosts votes that have happened recently, helping to surface more up-to-date answers.

It falls back to sorting by highest score if no posts are trending.

Switch to Trending sort

As mentioned @Juraj Kocan in comments, it happens after last VS Code updates.

This is Github issue related to this new «feature»

How to Get to the JSON settings in Newer Versions of VS Code

In the latest versions of VS Code, you can convert back to the split JSON settings editor by changing the following settings in the (now standard) UI settings editor:

Workbench > Settings: Editor

Workbench > Settings: Use Split JSON

after making this change, VS Code will open its settings as a JSON file, like in older versions of the application, rather than in the new UI. This allows you to make the changes that other answers provide, directly in the JSON (if you can find the right place and file to make them in..)

NOTE: Whether or not you actually want to use the JSON settings is a different question. Most of the time, the settings search function allows finding the same settings in the new UI. Sometimes it is difficult to get search to work though, especially if the settings are worded differently in the new UI style. There may also be cases where extensions haven’t been updated to accommodate the new UI setting style, and so there is no option but to enter the JSON directly.

Someone suggested that you open the settings.json file in vs code and add these and those properties to it. Then you will do a web search, which may lead you to this site. Today, Ourtechroom will explain in detail Where to Find Settings.json and How to Open Settings.js in vscode.

Settings.json

Settings.json is a crucial file in the vscode editor that is used to customize the user interface and functional functionality vscode reads and applies the settings and configuration from this file, which is in JSON format with key-value pairs.

If you make changes to the settings.json file, vs code may need to be restarted for the changes to take effect. These are the global settings for VS Code.

Table of Contents

These files have a JSON extension, and JSON files are commonly used to configure vscode settings since they are familiar with many languages and developers, and the JSON structure is straightforward to comprehend.

How to Open Settings.json File?

There are various ways to open the Settings.json file and we will discuss each of Them.

Method 1: Using GUI (Graphic User Interface)

The GUI version of the vscode code settings is simple to use. To utilize these settings, you don’t need any prior understanding of the JSON format.

This will open search fields.

2 Type settings.json in the search field. This will show two options. Just select Open Settings(JSON) fig. Open user settings using Shortcut and Search

This will open the settings.json file, which you may update and save to reflect your changes.

Method 2: Using GUI (Graphic User Interface)

The steps are as follows

1 Open VSCode editor

2 Click on Gear Icon located at the bottom left corner.

3 Then Click on Settings.

4 Click on File like icon located at the top right corner. fig. Open settings.json using Gear Option VSCode

This will open the settings.json file.

Method 2: Using File Explorer

The default location for user settings of vscode are as follows:

Simply navigate to these paths according to your operating system. Then, look for the settings.json file. Simply open that JSON file in any text editor and make the necessary modifications and save the file.

We discussed user settings in all three methods. settings.json, which is a global setting that applies to all of your VSCode projects.If you want project-specific or workspace configurations, please see the following:

WorkSpace Settings VS Code

Suppose you have a different project and you do not want to use all settings under settings.json then you can override this setting with WorkSpace Settings. When you want to share project-specific settings with your team, workspace settings come in handy. Workspace settings are applied to those folders and projects which are within the workspace. These settings files are located at the same level as your Projects Folder.
You can also have multiple root folders in a VS Code workspace using a feature called Multi-root workspaces.

WorkSpace Projects can be saved as your wish as you like.

Workspace Settings filename looks like this: .code-workspace and you can save it as where you like.And its settings look like this:

Open WorkSpace Setting Using GUI in vs code

Steps to open Workspace Settings using GUI are as follows:

1 First, open your desired Workspace.

2 Then Right-click on File > Preference > Settings

3 Navigate to Workspace tab

4 Then make changes on these settings that will apply to your current workspace. fig. Workspace settings

Folder Settings vs code

When you create a workspace, you will have many project folders, and each project folder can have settings.json. You can create a settings.json file inside your projects folder.

Its location will be in :

Open Folder Settings vs code

The steps are as follows:

1 First, open your desired Workspace.

2 Then Right-click on File > Preference > Settings

3 Navigate to your Project Folder tab

4 Then make changes on these settings that will apply to your current project only.

As a result, we discovered that settings in User Settings are overridden by Workspace settings, which are then overridden by Folder settings.

Conclusion:

In this way, we can open and view the different levels of settings like user settings, workspace settings, and projects settings in vscode.

Visual Studio Code Tips and Tricks

«Tips and Tricks» lets you jump right in and learn how to be productive with Visual Studio Code. You’ll become familiar with its powerful editing, code intelligence, and source code control features and learn useful keyboard shortcuts. This topic goes pretty fast and provides a broad overview, so be sure to look at the other in-depth topics in Getting Started and the User Guide to learn more.

If you don’t have Visual Studio Code installed, go to the Download page. You can find platform specific setup instructions at Running VS Code on Linux, macOS, and Windows.

Prefer a video? You can watch a recent Microsoft Build talk Visual Studio Code tips and tricks, which describes 20 tips and tricks for working productively with VS Code.

Basics

Getting started

The best way of exploring VS Code hands-on is to open the Get Started page. You will get an overview of VS Code’s customizations and features. Help > Get Started.

Pick a Walkthrough for a self-guided tour through the setup steps, features, and deeper customizations that VS Code offers. As you discover and learn, the walkthroughs track your progress.

If you are looking to improve your code editing skills open the Interactive Editor Playground. Try out VS Code’s code editing features, like multi-cursor editing, IntelliSense, Snippets, Emmet, and many more. Help > Editor Playground.

Command Palette

Access all available commands based on your current context.

Keyboard Shortcut: ⇧⌘P (Windows, Linux Ctrl+Shift+P )

Default keyboard shortcuts

All of the commands are in the Command Palette with the associated key binding (if it exists). If you forget a keyboard shortcut, use the Command Palette to help you out.

Keyboard reference sheets

Download the keyboard shortcut reference sheet for your platform (macOS, Windows, Linux).

Quick Open

Quickly open files.

Keyboard Shortcut: ⌘P (Windows, Linux Ctrl+P )

Typing commands such as edt and term followed by a space will bring up dropdown lists.

Navigate between recently opened files

Repeat the Quick Open keyboard shortcut to cycle quickly between recently opened files.

Open multiple files from Quick Open

You can open multiple files from Quick Open by pressing the Right arrow key. This will open the currently selected file in the background and you can continue selecting files from Quick Open.

Navigate between recently opened folders and workspaces

Keyboard Shortcut: ⌃R (Windows, Linux Ctrl+R )

Displays a Quick Pick dropdown with the list from File > Open Recent with recently opened folders and workspaces followed by files.

Command line

VS Code has a powerful command line interface (CLI) which allows you to customize how the editor is launched to support various scenarios.

Make sure the VS Code binary is on your path so you can simply type ‘code’ to launch VS Code. See the platform specific setup topics if VS Code is added to your environment path during installation (Running VS Code on Linux, macOS, Windows).

.vscode folder

Status Bar

Errors and warnings

Keyboard Shortcut: ⇧⌘M (Windows, Linux Ctrl+Shift+M )

Quickly jump to errors and warnings in the project.

Cycle through errors with F8 or ⇧F8 (Windows, Linux Shift+F8 )

You can filter problems either by type (‘errors’, ‘warnings’) or text matching.

Change language mode

Keyboard Shortcut: ⌘K M (Windows, Linux Ctrl+K M )

If you want to persist the new language mode for that file type, you can use the Configure File Association for command to associate the current file extension with an installed language.

Customization

There are many things you can do to customize VS Code.

Change your theme

Keyboard Shortcut: ⌘K ⌘T (Windows, Linux Ctrl+K Ctrl+T )

You can install more themes from the VS Code extension Marketplace.

Additionally, you can install and change your File Icon themes.

Keymaps

Are you used to keyboard shortcuts from another editor? You can install a Keymap extension that brings the keyboard shortcuts from your favorite editor to VS Code. Go to Preferences > Migrate Keyboard Shortcuts from. to see the current list on the Marketplace. Some of the more popular ones:

Customize your keyboard shortcuts

Keyboard Shortcut: ⌘K ⌘S (Windows, Linux Ctrl+K Ctrl+S )

You can search for shortcuts and add your own keybindings to the keybindings.json file.

Tune your settings

By default VS Code shows the Settings editor, you can find settings listed below in a search bar, but you can still edit the underlying settings.json file by using the Open Settings (JSON) command or by changing your default settings editor with the workbench.settings.editor setting.

Open User Settings settings.json

Keyboard Shortcut: ⌘, (Windows, Linux Ctrl+, )

Change the font size of various UI elements

Change the zoom level

Tip: You will need to have a font installed that supports font ligatures. FiraCode is a popular font on the VS Code team.

You can also toggle Auto Save from the top-level menu with the File > Auto Save.

Format on paste

Change the size of Tab characters

Whitespace characters are rendered by default in text selection.

Ignore files / folders

Removes these files / folders from your editor window.

Remove these files / folders from search results.

Language specific settings

You can scope the settings that you only want for specific languages by the language identifier. You can find a list of commonly used language IDs in the Language Identifiers reference.

Tip: You can also create language specific settings with the Configure Language Specific Settings command.

Add JSON validation

Enabled by default for many file types. Create your own schema and validation in settings.json

or for a schema defined in your workspace

or a custom schema

See more in the JSON documentation.

Extensions

Keyboard Shortcut: ⇧⌘X (Windows, Linux Ctrl+Shift+X )

Find extensions

Install extensions

In the Extensions view, you can search via the search bar or click the More Actions (. ) button to filter and sort by install count.

Extension recommendations

In the Extensions view, click Show Recommended Extensions in the More Actions (. ) button menu.

Creating my own extension

Are you interested in creating your own extension? You can learn how to do this in the Extension API documentation, specifically check out the documentation on contribution points.

Files and folders

Integrated Terminal

Keyboard Shortcut: ⌃` (Windows, Linux Ctrl+` )

Toggle Sidebar

Keyboard Shortcut: ⌘B (Windows, Linux Ctrl+B )

Toggle Panel

Keyboard Shortcut: ⌘J (Windows, Linux Ctrl+J )

Zen mode

Keyboard Shortcut: ⌘K Z (Windows, Linux Ctrl+K Z )

Enter distraction free Zen mode.

Press Esc twice to exit Zen Mode.

Side by side editing

Keyboard Shortcut: ⌘\ (Windows, Linux Ctrl+\ )

You can also drag and drop editors to create new editor groups and move editors between groups.

Switch between editors

Move to Explorer window

Keyboard Shortcut: ⇧⌘E (Windows, Linux Ctrl+Shift+E )

Create or open a file

Keyboard Shortcut: Ctrl+click ( Cmd+click on macOS)

Close the currently opened folder

Keyboard Shortcut: ⌘K F (Windows, Linux Ctrl+K F )

Navigation history

Navigate entire history: ⌃Tab (Windows, Linux Ctrl+Tab )

File associations

Create language associations for files that aren’t detected correctly. For example, many configuration files with custom file extensions are actually JSON.

Preventing dirty writes

VS Code will show you an error message when you try to save a file that cannot be saved because it has changed on disk. VS Code blocks saving the file to prevent overwriting changes that have been made outside of the editor.

In order to resolve the save conflict, click the Compare action in the error message to open a diff editor that will show you the contents of the file on disk (to the left) compared to the contents in VS Code (on the right):

Use the actions in the editor toolbar to resolve the save conflict. You can either Accept your changes and thereby overwriting any changes on disk, or Revert to the version on disk. Reverting means that your changes will be lost.

Note: The file will remain dirty and cannot be saved until you pick one of the two actions to resolve the conflict.

Editing hacks

Here is a selection of common features for editing code. If the keyboard shortcuts aren’t comfortable for you, consider installing a keymap extension for your old editor.

Multi cursor selection

To add cursors at arbitrary positions, select a position with your mouse and use Alt+Click ( Option+Click on macOS).

To set cursors above or below the current position use:

If you do not want to add all occurrences of the current selection, you can use ⌘D (Windows, Linux Ctrl+D ) instead. This only selects the next occurrence after the one you selected so you can add selections one by one.

Column (box) selection

You can select blocks of text by holding Shift+Alt ( Shift+Option on macOS) while you drag your mouse. A separate cursor will be added to the end of each selected line.

You can also use keyboard shortcuts to trigger column selection.

Vertical rulers

You can add vertical column rulers to the editor with the editor.rulers setting, which takes an array of column character positions where you’d like vertical rulers.

Fast scrolling

Pressing the Alt key enables fast scrolling in the editor and Explorers. By default, fast scrolling uses a 5X speed multiplier but you can control the multiplier with the Editor: Fast Scroll Sensitivity ( editor.fastScrollSensitivity ) setting.

Copy line up / down

The commands Copy Line Up/Down are unbound on Linux because the VS Code default keybindings would conflict with Ubuntu keybindings, see Issue #509. You can still set the commands editor.action.copyLinesUpAction and editor.action.copyLinesDownAction to your own preferred keyboard shortcuts.

Move line up and down

Keyboard Shortcut: ⌥↑ (Windows, Linux Alt+Up ) or ⌥↓ (Windows, Linux Alt+Down )

Shrink / expand selection

Keyboard Shortcut: ⌃⇧⌘← (Windows, Linux Shift+Alt+Left ) or ⌃⇧⌘→ (Windows, Linux Shift+Alt+Right )

You can learn more in the Basic Editing documentation.

Go to Symbol in File

Keyboard Shortcut: ⇧⌘O (Windows, Linux Ctrl+Shift+O )

Go to Symbol in Workspace

Keyboard Shortcut: ⌘T (Windows, Linux Ctrl+T )

Outline view

The Outline view in the File Explorer (default collapsed at the bottom) shows you the symbols of the currently open file.

You can sort by symbol name, category, and position in the file and allows quick navigation to symbol locations.

Navigate to a specific line

Keyboard Shortcut: ⌃G (Windows, Linux Ctrl+G )

Undo cursor position

Keyboard Shortcut: ⌘U (Windows, Linux Ctrl+U )

Trim trailing whitespace

Keyboard Shortcut: ⌘K ⌘X (Windows, Linux Ctrl+K Ctrl+X )

Transform text commands

You can change selected text to uppercase, lowercase, and title case with the Transform commands from the Command Palette.

Code formatting

Currently selected source code: ⌘K ⌘F (Windows, Linux Ctrl+K Ctrl+F )

Code folding

Keyboard Shortcut: ⌥⌘[ (Windows, Linux Ctrl+Shift+[ ) and ⌥⌘] (Windows, Linux Ctrl+Shift+] )

You can also fold/unfold all regions in the editor with Fold All ( ⌘K ⌘0 (Windows, Linux Ctrl+K Ctrl+0 ) ) and Unfold All ( ⌘K ⌘J (Windows, Linux Ctrl+K Ctrl+J ) ).

You can fold all block comments with Fold All Block Comments ( ⌘K ⌘/ (Windows, Linux Ctrl+K Ctrl+/ ) ).

Select current line

Keyboard Shortcut: ⌘L (Windows, Linux Ctrl+L )

Navigate to beginning and end of file

Keyboard Shortcut: ⌘↑ (Windows, Linux Ctrl+Home ) and ⌘↓ (Windows, Linux Ctrl+End )

Open Markdown preview

In a Markdown file, use

Keyboard Shortcut: ⇧⌘V (Windows, Linux Ctrl+Shift+V )

Side by side Markdown edit and preview

In a Markdown file, use

Keyboard Shortcut: ⌘K V (Windows, Linux Ctrl+K V )

The preview and editor will synchronize with your scrolling in either view.

IntelliSense

⌃Space (Windows, Linux Ctrl+Space ) to trigger the Suggestions widget.

You can view available methods, parameter hints, short documentation, etc.

Go to Definition

You can also see the type definition if you press Ctrl ( Cmd on macOS) when you are hovering over the type.

Go to References

Find All References view

Select a symbol then type ⇧⌥F12 (Windows, Linux Shift+Alt+F12 ) to open the References view showing all your file’s symbols in a dedicated view.

Rename Symbol

Search and modify

.eslintrc.json

Install the ESLint extension. Configure your linter however you’d like. Consult the ESLint specification for details on its linting rules and options.

Here is configuration to use ES6.

package.json

See IntelliSense for your package.json file.

Emmet syntax

Snippets

Create custom snippets

File > Preferences > User Snippets (Code > Preferences > User Snippets on macOS), select the language, and create a snippet.

Git integration

Keyboard Shortcut: ⌃⇧G (Windows, Linux Ctrl+Shift+G )

Git integration comes with VS Code «out-of-the-box». You can install other SCM providers from the Extension Marketplace. This section describes the Git integration but much of the UI and gestures are shared by other SCM providers.

Diffs

From the Source Control view, select a file to open the diff.

Alternatively, click the Open Changes button in the top right corner to diff the current open file.

Views

The default view for diffs is the side by side view.

Toggle inline view by clicking the More Actions (. ) button in the top right and selecting Toggle Inline View.

Review pane

Edit pending changes

You can make edits directly in the pending changes of the diff view.

Branches

Easily switch between Git branches via the Status Bar.

Staging

Stage file changes

Hover over the number of files and click the plus button.

Click the minus button to unstage changes.

Stage selected

Stage a portion of a file by selecting that file (using the arrows) and then choosing Stage Selected Ranges from the Command Palette.

Undo last commit

Click the (. ) button and then select Undo Last Commit to undo the previous commit. The changes are added to the Staged Changes section.

See Git output

VS Code makes it easy to see what Git commands are actually running. This is helpful when learning Git or debugging a difficult source control issue.

Gutter indicators

View diff decorations in editor. See documentation for more details.

Resolve merge conflicts

During a merge, go to the Source Control view ( ⌃⇧G (Windows, Linux Ctrl+Shift+G ) ) and make changes in the diff view.

You can resolve merge conflicts with the inline CodeLens which lets you Accept Current Change, Accept Incoming Change, Accept Both Changes, and Compare Changes.

Set VS Code as default merge tool

Set VS Code as default diff tool

Debugging

Configure debugger

From the Run and Debug view ( ⇧⌘D (Windows, Linux Ctrl+Shift+D ) ), select create a launch.json file, which will prompt you to select the environment that matches your project (Node.js, Python, C++, etc). This will generate a launch.json file. Node.js support is built-in and other environments require installing the appropriate language extensions. See the debugging documentation for more details.

Breakpoints and stepping through

Place breakpoints next to the line number. Navigate forward with the Debug widget.

Data inspection

Inspect variables in the Run panels and in the console.

Logpoints

Logpoints act much like breakpoints but instead of halting the debugger when they are hit, they log a message to the console. Logpoints are especially useful for injecting logging while debugging production servers that cannot be modified or paused.

Add a logpoint with the Add Logpoint command in the left editor gutter and it will be displayed as a «diamond» shaped icon. Log messages are plain text but can include expressions to be evaluated within curly braces (‘<>‘).

Task runner

Auto detect tasks

Select Terminal from the top-level menu, run the command Configure Tasks, then select the type of task you’d like to run. This will generate a tasks.json file with content like the following. See the Tasks documentation for more details.

There are occasionally issues with auto generation. Check out the documentation for getting things to work properly.

Run tasks from the Terminal menu

Select Terminal from the top-level menu, run the command Run Task, and select the task you want to run. Terminate the running task by running the command Terminate Task

Define keyboard shortcuts for tasks

For example, to bind Ctrl+H to the Run tests task, add the following:

Run npm scripts as tasks from the Explorer

Portable mode

VS Code has a Portable mode which lets you keep settings and data in the same location as your installation, for example, on a USB drive.

Insiders builds

The Visual Studio Code team uses the Insiders version to test the latest features and bug fixes of VS Code. You can also use the Insiders version by downloading it here.

How to open settings json vscode

User and Workspace Settings

It is easy to configure VS Code to your liking through settings. Nearly every part of VS Code’s editor, user interface, and functional behavior have options you can modify.

VS Code provides two different scopes for settings:

Creating User and Workspace Settings

The menu command File > Preferences > Settings (Code > Preferences > Settings on Mac) provides entry to configure user and workspace settings. You are provided with a list of Default Settings. Copy any setting that you want to change to the appropriate settings.json file. The tabs on the right let you switch quickly between the user and workspace settings files.

You can also open the user and workspace settings from the Command Palette ( kb(workbench.action.showCommands) ) with Preferences: Open User Settings and Preferences: Open Workspace Settings.

In the example below, we disabled line numbers in the editor and configured line wrapping to wrap automatically based on the size of the editor.

Changes to settings are reloaded by VS Code after the modified settings.json file is saved.

Note: Workspace settings are useful for sharing project specific settings across a team.

Settings File Locations

Depending on your platform, the user settings file is located here:

When you open settings, we show Default Settings to search and discover settings you are looking for. When you search using the big Search bar, it will not only show and highlight the settings matching your criteria, but also filter out those which are not matching. This makes finding settings quick and easy. There are actions available inside Default Settings and settings.json editors which will help you quickly copy or update a setting.

Note: VS Code extensions can also add their own custom settings and they will be visible in the Default Settings list at runtime.

Default settings are represented in groups so that you can navigate them easily. It has Most Commonly Used group on the top to see the most common customizations done by VS Code users.

Here is the copy of default settings that comes with VS Code.

Language specific editor settings

To customize your editor by language, run the global command Preferences: Configure language specific settings. (command id: workbench.action.configureLanguageBasedSettings ) from the Command Palette ( kb(workbench.action.showCommands) ) which opens the language picker. Selecting the language you want, opens the Settings editor with the language entry where you can add applicable settings.

You can use IntelliSense in Settings editor to help you find allowed language based settings. All editor settings and some non-editor settings are supported.

Settings and security

In settings, we allow you to specify some of the executables that VS Code will run to do its work. For example, you can choose which shell the Integrated Terminal should use. For enhanced security, such settings can only be defined in user settings and not at workspace scope.

Here is the list of settings we don’t support at the workspace scope:

The first time you open a workspace which defines any of these settings, VS Code will warn you and subsequently always ignore the values after that.

Copy of Default Settings

Below are the default settings and their values.

Q: When does it make sense to use workspace settings?

A: If you’re using a workspace that needs custom settings but you don’t want to apply them to your other VS Code projects. A good example is language-specific linting rules.