Right click on Windows folder and open with Visual Studio Code

I’m all about using Visual Studio Code for Node.js development.  It is a lightweight code editor and runs on Windows, Mac OS X, and Linux.  I enjoy it so much that I also use it for Node.js projects on the Raspberry Pi.  To accomplish this, I create a Windows file share on the RasPi as described in my Beginner’s Guide to Installing Node.js on the Raspberry Pi and map a drive on my Windows system to the RasPi.  I am then able to use VS Code to create my Node.js code and jump onto the RasPi to run the actual code.

Anyway, back to our regularly scheduled program…  Today’s topic is aimed at Windows users who are using Visual Studio Code and want to be able to right click on a given folder and launch VS Code.  We’re going to add a right click context menu item to “Open Folder as VS Code Project” since it saves time—and it’s more fun!

Major Edit: It turns out that when you install VS Code for Windows, you have an opportunity to add an “Open with Code” action to the Windows Explorer file context menu—if you don’t hastily sprint through the installation and take the defaults like I did the first time around. 🙂  Take a deep breath and jog rather than scream through the installation. When you see the dialog box below, be sure to check the two checkboxes highlighted.

VS Code Install

Ignore the rest of this post unless you don’t want to re-install VS Code or if you are curious for other contexts.  It’s easier to simply re-install VS Code.

Let’s make it so.  I am leveraging the excellent work of some of my friends on GitHub who created a Windows context menu item for Sublime Text 2/3.

First, create a file with a “.reg” extension.  For example, vsCodeOpenFolder.reg.

You are then positioned to add these contents to the file:

Windows Registry Editor Version 5.00

; Open files
[HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
@="Edit with VS Code"
"Icon"="C:\\Program Files\\Microsoft VS Code\\Code.exe,0"

[HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
@="\"C:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%1\""

; This will make it appear when you right click ON a folder
; The "Icon" line can be removed if you don't want the icon to appear

[HKEY_CLASSES_ROOT\Directory\shell\vscode]
@="Open Folder as VS Code Project"
"Icon"="\"C:\\Program Files\\Microsoft VS Code\\Code.exe\",0"

[HKEY_CLASSES_ROOT\Directory\shell\vscode\command]
@="\"C:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%1\""


; This will make it appear when you right click INSIDE a folder
; The "Icon" line can be removed if you don't want the icon to appear

[HKEY_CLASSES_ROOT\Directory\Background\shell\vscode]
@="Open Folder as VS Code Project"
"Icon"="\"C:\\Program Files\\Microsoft VS Code\\Code.exe\",0"

[HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]
@="\"C:\\Program Files\\Microsoft VS Code\\Code.exe\" \"%V\""

Next, save the file.

Note: the above .reg file assumes that you installed VS Code in the default location—which will be the case for most people. Adjust accordingly if the Code.exe file is installed in a different folder.

Very nice – we are almost done.  Double click on the vsCodeOpenFolder.reg file that you just created.

Windows UAC (User Account Control) will launch and ask you if you want to allow this app to make changes to your PC.  Go ahead and click OK so you can merge the registry code contained in the file with the Windows Registry on your computer.

That’s all there is to it!  You can now navigate to a folder through Windows Explorer, right click on either the folder icon or in the folder itself, and you will see an option to “Open Folder as VS Code Project”.  As a bonus, you can right click on individual files and “Edit with VS Code” as well.

You can now smile at the fact that you’ll have a little more time each day to write amazing code in Node.js/JavaScript or any of the other languages available for use with VS Code.

Follow Dave Johnson on Twitter to stay up to date on the latest tutorials and tech articles.

Share

103 thoughts on “Right click on Windows folder and open with Visual Studio Code

  1. Why is the parameter for folder context menu in [HKEY_CLASSES_ROOT\Directory\shell\vscode\command] a %1 and not %v like the background folder context menu?

    1. Thanks for your question, Jeff! As noted in the post, I leveraged the work of someone who posted some GitHub code and it works as is. As best as I can tell, %1 and %V are interchangeable and either could have been used, but I have not tested. Let me know if you test and learn something. I left the .reg code in place for progeny; however, the most expeditious solution in the case of VS Code is to simply reinstall VS Code and check the boxes to add an “Open with Code” action to the Windows Explorer file/directory context menu.

  2. Top notch, love it. The icon is a very nice touch – helps my “I can’t read a list to save my life” old eyes 🙂

  3. awesome! thanks – i was getting tired of the shft-right click somewhere not on a file to launch a cmd window then >code .

    now i can launch a cmd from VS Code using Ctrl-Shift-C

    1. update: i usually jump out of VS Code to get to a cmd and i now i don’t have the find the original (since i was launching >code . from a cmd that was launched from a windows explorer). this will helps keep my spawning of cmd’s down to the minimum or as needed.

      1. You are very welcome – glad my article was helpful to you! You can also use VS Code’s integrated terminal to avoid the need to jump out to a separate cmd window. From the menu, select View | Integrated Terminal or press Ctrl+` (backtick). I find the integrated terminal to be very helpful so I can stay in the VS Code context to do npm installs, run python scripts, etc.

  4. Thanks! My VSCode is back to normal.
    Although I had checked the options for “right-click”, they had disappeared after an xyz windows update. Cheers!

  5. I usa a portable ZIp version of the VS Code… This REG tip is nice, but how remove these key …
    What would be the script for the reverse operation to clear these entries?

    1. Great question! You can create a second reg file called removeVsCodeOpenFolder.reg, for example, and include the following contents:

      Windows Registry Editor Version 5.00

      [-HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
      [-HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
      [-HKEY_CLASSES_ROOT\Directory\shell\vscode]
      [-HKEY_CLASSES_ROOT\Directory\shell\vscode\command]
      [-HKEY_CLASSES_ROOT\Directory\Background\shell\vscode]
      [-HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]

       

      The minus (-) symbols in front of the registry keys are used to delete the registry keys as explained here.

  6. For the New VSCode V 1.17.1, the .reg file should be modified to be:

    Windows Registry Editor Version 5.00
    ; Open files
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
    @=”Edit with VS Code”
    “Icon”=”C:\\Program Files\\Microsoft VS Code\\Code.exe,0″
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click ON a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\shell\vscode]
    @=”Open Folder as VSCode Project”
    “Icon”=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\shell\vscode\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click INSIDE a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode]
    @=”Open Folder as VSCode Project”
    “Icon”=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%V\””

  7. Great! Just make sure to check the route to your “Code.exe” file.
    In my case had to remove the -(x86)- from -Program Files (x86).

    Had to change:
    @=”\”C:\\Program Files (x86)\\Microsoft VS Code\\Code.exe\” \”%1\””

    To:
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%1\””

    Thank you very much!

    1. Hi Miglos, thanks for letting me know! Microsoft has released the 64-bit version of VS Code and this is now the default version that people download. Therefore, the executable is now installed under “Program Files” rather than “Program Files (x86)”. I updated my post accordingly.

  8. ATTENTION – It didn’t worked for me till I replaced the quotes of the above solutions with “Regular Quotes” (these comments has a text Font with a different quotes then the “Regular”)

  9. Thanks man! Worked like a clock.
    My VS Code would update itself before I did the reg and during update it still woudln’t let me add the explorer thingie.

  10. Great post. I just started with VSCode a few weeks ago on a lab server slave to test and it’s replaced Notepad++ for me because of its extensive C# integration and completion. Thank you SO MUCH for sharing your experience!!

  11. hey guys!
    I have noticed that there is a problem when path contains a space sign (for example “C:/My Projects/”)
    opening folder in VSCode by context menu opens parts of the path as files (like file “My” and second file “Projects”.

    I have tried to modify an entry below, but with no results.
    “[HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%V\”””

  12. Hi. I see that you don’t update your blog too often. I know that writing articles is
    time consuming and boring. But did you know that there is
    a tool that allows you to create new posts using existing content (from article directories or other websites from your niche)?
    And it does it very well. The new articles are unique and pass the copyscape test.

    You should try miftolo’s tools

  13. I am getting the following error message when opening a folder in visual studio code from context menu:

    [Window Title]
    Visual Studio Code

    [Main Instruction]
    A second instance of Code is already running as administrator.

    [Content]
    Please close the other instance and try again.

    [Close]

  14. you are the best! one thing that important: if you windows 10’s user, your vs code might be here –> “C:\\Users\\user\\AppData\\Local\\Programs\\Microsoft VS Code”
    i changed every location to there, then your .reg works perfectly. thank you.

  15. It all works perfectly..until I try to use the function. When I click “Open Folder in VS Code”, an error pops up saying: ”
    FILE PATH HERE
    Application not Found

    Help

  16. Super. Worked first time, even when i had to change the default locations to my install locations, nice one, thanks.

  17. Late, I know, but not sure if everybody knows this…
    You can re-download VS Code from their official page, even if you already have it installed. You do not need to uninstall your current VS Code. It does not mess up any extensions, themes, fonts, pages open, nothing. (I did it just now).

    During your new installation, install it to the same folder, and this time actually turn on the ‘Open in VS Code’ option. I think its better to have the native application edit the registry in its designated locations rather than manually doing it.

    So yeah. Got this from a VS Code dev board.

  18. This is incredibly helpful for using VS Code in portable mode, because it doesn’t use an installer and therefore doesn’t have the option to set up the context menus. It’s very nice to have those menus back. Thank you!!

  19. That’s cool! I almost did it; but then I just rethought the process. So I grabbed the VS Code download and just ran the install even though I already have VS Code installed. I made sure those boxes where checked and bam! Done didn’t touch any my extensions etc too. Much faster way unless you’re particular about a verson of VSCode which seems weird.

    1. Nice dude! Worked perfectly, I even used a new installer from vs code website, installed on top of my installation and checked the boxes. Thank you!

  20. Had to adjust the folder since I installed it on my secondary drive but it still worked like a charm
    Tyvm

  21. I tried the same as you do but It didn’t worked for me. So how can i reverse this process?

  22. How to Undo this ?? I mean how to remove these registry!! It’s not working for me. I want remove it and try another approach.

  23. The icon on my computer is not the normal icon. How do i fix it? In the code, the directory is wrong. VSCode on my computer is in AppData folder. Please help

  24. Thanks for that!

    If you don´t have the permission to import it into HKEY_CLASSES_ROOT, import it to your current user under HKEY_USERS.

    For me the entry for files was already activated for all users, so I haven´t imported them again.
    Code will look like this (Note: You have to replace S-WIRED-NUMBERS with your user):
    Windows Registry Editor Version 5.00
    ; Open files
    ;[HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
    ;@=”Edit with VS Code”
    ;”Icon”=”C:\\Program Files\\Microsoft VS Code\\Code.exe,0″
    ;[HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
    ;@=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click ON a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_USERS\S-WIRED-NUMBERS_Classes\Directory\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_USERS\S-WIRED-NUMBERS_Classes\Directory\shell\vscode\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click INSIDE a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_USERS\S-WIRED-NUMBERS_Classes\Directory\Background\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_USERS\S-WIRED-NUMBERS_Classes\Directory\Background\shell\vscode\command]
    @=”\”C:\\Program Files\\Microsoft VS Code\\Code.exe\” \”%V\””

  25. Just a kind reminder that make sure to check your route path for Code.exe and modify accordingly if it doesn’t work for you.
    For instance, mine is C:\\Users\\\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe which the default path won’t work for me and it’s working fine after adjusting.

    1. Just to correct the missing part of my path above…
      C:\\Users\\{username}\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe

  26. I tried following the steps mentioned in this article for the 1.56 version of the VS Code I have on my Windows 10 system. Although creating the .reg file with the code mentioned, did add the registry points through the Windows Registry editor, the file path(“C:\\Program Files\\Microsoft VS Code\\Code.exe\”) mentioned as “default path that VS Code gets installed in” in this article is outdated.
    And the default path that VS Code gets installed in is actually “C:\users\{username}\AppData\Local\Programs\Microsoft VS Code.” according to the official website from which you can download VS Code on your machine (https://code.visualstudio.com/docs/setup/windows).

    It is best to just re-install VS Code on top of the existing one and choosing the “Open With Code” option during the installation process as suggested initially.

  27. The above code needs to correct as follows. Use the following code.

    Windows Registry Editor Version 5.00
    ; Open files
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
    @=”Edit with VS Code”
    “Icon”=”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe,0″
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
    @=”\”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click ON a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\shell\vscode\command]
    @=”\”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\” \”%1\””
    ; This will make it appear when you right click INSIDE a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]
    @=”\”C:\\Users\\ASUS\\AppData\\Local\\Programs\\Microsoft VS Code\\Code.exe\” \”%V\””

  28. how can i delete it like from being in the menu bar, i accidentlly choose the wrong direction and now i cant get rid of it

  29. Can you post a version that only installs for the HKEY_CURRENT_USER my work doesn’t allow admin access

  30. PROBLEM OCCURED!!!!!!

    I created .reg file and did as you mentioned, with directory changed as my installation location. The option “Open with VS code editor” appeared when I right clicked my folders, but its only in option and doesn’t actually opens in vs code. When I click that option, nothing happens. Now I want to remove that option since it is not useful. I deleted that .reg file but that option is still there and I don’t know how to remove it. The contents I used in my .reg file are as follows:

    Windows Registry Editor Version 5.00
    ; Open files
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code]
    @=”Edit with VS Code”
    “Icon”=”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\,0″
    [HKEY_CLASSES_ROOT\*\shell\Open with VS Code\command]
    @=”\”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\” \”%1\””
    ; This will make it appear when you right click ON a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\shell\vscode\command]
    @=”\”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\” \”%1\””
    ; This will make it appear when you right click INSIDE a folder
    ; The “Icon” line can be removed if you don’t want the icon to appear
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode]
    @=”Open Folder as VS Code Project”
    “Icon”=”\”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\”,0″
    [HKEY_CLASSES_ROOT\Directory\Background\shell\vscode\command]
    @=”\”E:\\InstallationFiles\\Visual Studio\\Microsoft VS Code\\bin\\Code.exe\” \”%V\””

    PLEASE HELP. I don’t want that not working “open with vs code editor” option when I right click on folders. Please either make it working or help me remove it. thank you :(, waiting for response.

  31. Just install vs-code again without removing existing one. And it will update this settings and will remove this option you mentioned

  32. When double clicking the file I get “Cannot import [PATH_TO_vsCodeOpenFolder.reg] Error accessing the registry”. How do I get it to work?

Leave a Reply

Your email address will not be published. Required fields are marked *