Skip to content

NomarCub/obsidian-open-vscode

Repository files navigation

Open in VSCode

This plugin for Obsidian makes a ribbon button and two commands to open your vault as a Visual Studio Code workspace:

  • open-vscode: Uses child_process to launch VSCode with the code command. Currently, this is the command bound to the ribbon button.
  • open-vscode-via-url: Open VSCode using a vscode:// URL (Windows users, please see notes regarding the UX of this command)

It's functionality is probably made redundant now using the Shell commands and Customizable Sidebar (or Buttons) plugins, but it'll be maintained for the foreseeable future.

You can use VSCode for various purposes with your vault, such as for git version control, markdown formatting with Prettier, linting with markdownlint, mass formatting files and more.

video showcase

The icons work with light and dark mode.

light and dark

You can also use it as a command and assign hotkeys to it. You can disable the ribbon button in settings. command

Settings

  • Display Ribbon Icon
  • Ribbon opens via code (can alteratively open via URL method)

Template for executing the code command

You can template the command opening VSCode however you like with its provided command line arguments. This way you can technically launch any command you set, so take caution. Potential use cases include opening workspaces with .code-workspace files (e.g. for Dendron), opening specific files, folders, etc.

Note that on MacOS, a full path to the VSCode executable is required (generally "/usr/local/bin/code").

You can use the following variables: {{vaultpath}} (absolute), {{filepath}} (relative), {{folderpath}} (relative). The default template is code "{{vaultpath}}" "{{vaultpath}}/{{filepath}}", which opens the current file (if there is one) in the workspace that is the vault's root folder. This gets expanded to be executed in your shell as code "C:\Users\YourUser\Documents\vault" "C:\Users\YourUser\Documents\vault/Note.md", for example.

Settings for open-vscode-via-url

On some systems, this may be faster than using the child_process approach.

  • Open file

    Open the current file rather than the root of the Obsidian vault.

  • Path to VSCode Workspace

    Defaults to the {{vaultpath}} template variable. You can set this to an absolute path to a ".code-workspace" file if you prefer to use a Multi Root workspace file

  • Open VSCode using a vscode-insiders:// URL

The first time you use the URL method for opening, VSCode displays a confirmation dialog (that you just can hit enter on) for security reasons. See this issue for more infomation.

Caveats regarding the URL command for Windows users

TLDR; We recommend that Windows users prefer the open-vscode command (and not the URL one).

Due to security updates in VSCode, the user experience of using opening VSCode via URL comes with some known issues!

On Windows, when opening via URL, you are prompted to allow VSCode to access the file. At present there's no option in VSCode to whitelist safe locations (ie your Obsidian vault), so you get this dialog every time ☹️.

Worse, if you are opening via URL, and have toggled the "Open File" setting on, then VSCode will attempt to open a second instance of VSCode, and will warn that there's another instance of Code running but not responding.

If this issue affects you, please consider watching and voting for the following VSCode issues:

Installation

You can install the plugin via the Community Plugins tab within the Obsidian app.
Here's the plugin in Obsidian's Community Plugins website.
You can install the plugin manually by copying a release to your .obsidian/plugins/open-vscode folder.

Development

This plugin follows the structure of the Obsidian Sample Plugin, see further details there.
Contributions are welcome.

If pjeby/hot-reload is installed, activated, and open-vscode is registered with hot-reload, then extra logging and DX commands to refresh settings are activated.

Credits

Original plugin by NomarCub.
If you like this plugin you can sponsor me here on GitHub: Sponsor NomarCub, on Ko-fi here: Buy Me a Coffee at ko-fi.com, or on PayPal here: Paypal.

Toggle ribbon setting by ozntel.
UseURL: open file in workspace feature and restructure by ptim.

Thank you to the makers of the DEVONlink plugin, as it was a great starting point for working with ribbon icons in Obsidian. The icon is from Simple Icons (SVG).