Code editing in Visual Studio Code

In this Visual Studio Code tutorial, we cover how to edit and run a small piece of code, including the features outlined below. After viewing this overview, read on in the Related Resources section to see more features.

Linux users: Make sure you have the correct multimedia codecs installed for your Linux distribution. For example, on Ubuntu, you may need to install ubuntu-restricted-extras to get the necessary codecs to play the videos.

Here's the next video we recommend: Productivity Tips

Pick another video from the list: Introductory Videos

Video outline

• Open a folder.
  • File > Open Folder (

    Ctrl+K Ctrl+O

    )
• Use File Explorer to view the folder's files and subfolders.
  • View > Explorer (

    ⇧⌘E

    (Windows, Linux

    Ctrl+Shift+E

    )
    )
• Install the Node.js runtime to execute JavaScript code.
  • Find Node.js for your platform at https://nodejs.org
• Check your Node.js installation.
  • From a terminal or command prompt, type node --version
• Create new file.
  • File > New File (

    ⌘N

    (Windows, Linux

    Ctrl+N

    )
    )
• Create a simple "Hello world" console application called app.js.
• IntelliSense provides suggestions as you type.
• Automatically format the source code.
  • Format Document command (

    ⇧⌥F

    (Windows

    Shift+Alt+F

    , Linux

    Ctrl+Shift+I

    )
    )
• Turn on Auto Save.
  • File > Auto Save
• Display the Integrated Terminal.
  • View > Terminal (

    ⌃`

    (Windows, Linux

    Ctrl+`

    )
    )
• Split the terminal.
  • Split Terminal (

    ⌘\

    (Windows, Linux

    Ctrl+Shift+5

    )
    )
• Create new terminal.
  • Create New Terminal (

    ⌃⇧`

    (Windows, Linux

    Ctrl+Shift+`

    )
    )
• Run the application.
  • From the Integrated Terminal, type node app.js

Next video

• Productivity Tips -Become a VS Code power user with these productivity tips.
• Introductory Videos - Review the entire list of videos.

Related resources

Visual Studio Code on Windows

Installation

1. Download the Visual Studio Code installer for Windows.
2. Once it is downloaded, run the installer (VSCodeUserSetup-{version}.exe). This will only take a minute.
3. By default, VS Code is installed under C:\Users\{Username}\AppData\Local\Programs\Microsoft VS Code.

Alternatively, you can also download a Zip archive, extract it and run Code from there.

Tip: Setup will add Visual Studio Code to your %PATH%, so from the console you can type 'code .' to open VS Code on that folder. You will need to restart your console after the installation for the change to the %PATH% environmental variable to take effect.

User setup versus system setup

VS Code provides both Windows user and system level setups.

The user setup does not require Administrator privileges to run as the location will be under your user Local AppData (LOCALAPPDATA) folder. Since it requires no elevation, the user setup is able to provide a smoother background update experience. This is the preferred way to install VS Code on Windows.

Note: When running VS Code as Administrator in a user setup installation, updates will be disabled.

The system setup requires elevation to Administrator privileges to run and will place the installation under the system's Program Files. The in-product update flow will also require elevation, making it less streamlined than the user setup. On the other hand, installing VS Code using the system setup means that it will be available to all users in the system.

See the Download Visual Studio Code page for a complete list of available installation options.

VS Code ships monthly releases and supports auto-update when a new release is available. If you're prompted by VS Code, accept the newest update and it will be installed (you won't need to do anything else to get the latest bits).

Note: You can disable auto-update if you prefer to update VS Code on your own schedule.

Windows Subsystem for Linux

Windows is a popular operating system and it can be a great cross-platform development environment. This section describes cross-platform features such as the Windows Subsystem for Linux (WSL) and the new Windows Terminal.

Recent Windows build

Make sure you are on a recent Windows 10 build. Check Settings > Windows Update to see if you are up-to-date.

Windows as a developer machine

With WSL, you can install and run Linux distributions on Windows. This enables you to develop and test your source code on Linux while still working locally on your Windows machine.

When coupled with the WSL extension, you get full VS Code editing and debugging support while running in the context of WSL.

See the Developing in WSL documentation to learn more or try the Working in WSL introductory tutorial.

New Windows Terminal

Available from the Microsoft Store, the Windows Terminal (Preview) lets you easily open PowerShell, Command Prompt, and WSL terminals in a multiple tab shell.

Next steps

Once you have installed VS Code, these topics will help you learn more about VS Code:

• Additional Components - Learn how to install Git, Node.js, TypeScript, and tools like Yeoman.
• User Interface - A quick orientation to VS Code.
• User/Workspace Settings - Learn how to configure VS Code to your preferences through settings.
• Tips and Tricks - Lets you jump right in and learn how to be productive with VS Code.

Common questions

What command-line arguments are supported by the Windows Setup?

VS Code uses Inno Setup to create its setup package for Windows. Thus, all the Inno Setup command-line switches are available for use.

Additionally, you can prevent the Setup from launching VS Code after completion with /mergetasks=!runcode.

Scrolling is laggy and not smooth

On certain devices, editor scrolling is not smooth but laggy for an unpleasant experience. If you notice this issue, make sure you install the Windows 10 October 2018 update where this issue is fixed.

I'm having trouble with the installer

Try using the zip file instead of the installer. To use this, unzip VS Code in your AppData\Local\Programs folder.

Note: When VS Code is installed via a Zip file, you will need to manually update it for each release.

Icons are missing

I installed Visual Studio Code on my Windows 8 machine. Why are some icons not appearing in the workbench and editor?

VS Code uses SVG icons and we have found instances where the .SVG file extension is associated with something other than image/svg+xml. We're considering options to fix it, but for now here's a workaround:

Using the Command Prompt:

1. Open an Administrator Command Prompt.
2. Type REG ADD HKCR\.svg /f /v "Content Type" /t REG_SZ /d image/svg+xml.

Using the Registry Editor (regedit):

1. Start regedit.
2. Open the HKEY_CLASSES_ROOT key.
3. Find the .svg key.
4. Set its Content Type Data value to image/svg+xml.
5. Exit regedit.

Unable to run as admin when AppLocker is enabled

With the introduction of process sandboxing (discussed in this blog post) running as administrator is currently unsupported when AppLocker is configured due to a limitation of the runtime sandbox. If your work requires that you run VS Code from an elevated terminal, you can launch code with --no-sandbox --disable-gpu-sandbox as a workaround.

Subscribe to issue #122951 to receive updates.

Working with UNC paths

Beginning with version 1.78.1, VS Code on Windows will only allow to access UNC paths (these begin with a leading \\) that were either approved by the user on startup or where the host name is configured to be allowed via the new security.allowedUNCHosts setting.

If you rely on using UNC paths in VS Code, you can either

• configure the host to be allowed via the security.allowedUNCHosts setting (for example add server-a when you open a path such as \\server-a\path)
• map the UNC path as network drive and use the drive letter instead of the UNC path (documentation)
• define a global environment variable NODE_UNC_HOST_ALLOWLIST with the backslash-separated list of hostnames to allow, for example: server-a\server-b to allow the hosts server-a and server-b.

Note: if you are using any of the remote extensions to connect to a workspace remotely (such as SSH), the security.allowedUNCHosts has to be configured on the remote machine and not the local machine.

This change was done to improve the security when using VS Code with UNC paths. Please refer to the associated security advisory for more information.