Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>VSCode LinksNew to Visual Studio Code? Get it now.
VSCode Links

VSCode Links

Samuel Braun

|
125 installs
| (0) | Free
Create any links to files and websites based on patterns.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

VSCode Links

  • Setup
  • Docs
  • Config
  • Examples
  • Latest Changes

Setup

  • Install the extension here
  • Create a config file Ctrl+Shift+P -> VSC Links: Create Config File
  • Optional npm i -D vscl@latest (Adds typings for easier config editing)

Docs

Read the full docs here

Previews

Debugging your config

  • Open the output panel
  • Select VSCode Links from the dropdown
  • Errors will be shown here
  • If the links dont work/update, try Ctrl+Shift+P -> VSC Links: Restart (can happen when renaming/moving config file)
  • Use the log function argument of your handler function to log strings to the output panel.

Config

links

An array of link objects with the properties:

  • include: Glob pattern to include files. (string | string[])
  • exclude: Glob pattern to exclude files. Will exclude even if a file is included. (string | string[])
  • pattern: Regex pattern to match links. Use (?<link>ClickableText) to define the clickable area if its different from the whole regex match. (RegExp)
  • handle: Function to handle the link. (Function)
    • linkText: Text matched by the pattern. (string)
    • file: Template literal tag to get the file path based on the current file and os.
    • workspace: Template literal tag to get the workspace file path based on your relative path and os.
    • log: Function to log strings to the VSCode Links output panel.

extends

A string or array of strings to extend other config files. (string | string[]) Example: "./other-config.js"

Examples

Git Links You can create a config to open git issues in your browser like this:
import { type Config } from "vscl"

export default {
  links: [
    {
      include: "**/*.js",
      pattern: /git#\d+/g, // Clickable: "git#123"
      handle: ({ linkText }) => {
        const issue = linkText.replace("git#", "")
        return {
          target: `https://github.com/webry-com/vscode-links/issues/${issue}`,
        }
      },
    },
  ],
} satisfies Config
API Strings Here is a config to open the python file based on an api route in frappe:
import { type Config } from "vscl"

export default {
  links: [
    {
      include: "*",
      pattern: /"(?<link>frappe(\.[^"'`]+)+)"/g, // Clickable: "frappe.core.doctype.user.user.get_timezones"
      handle: ({ linkText, workspace }) => {
        const parts = linkText.split(".")
        const apiName = parts.pop()
        return {
          target: workspace`${parts.join("/")}.py`,
          tooltip: `Open python file for the "${apiName}" API.`,
          jumpPattern: `def ${apiName}(`, // Jump to the function definition in user.py
        }
      },
    },
  ],
} satisfies Config

Latest Changes

  • Breaking: The workspace and file helpers from vscode-links-cli will no longer work. Instead they are now arguments to the handle function (see examples).
  • Added docs
  • Added Typescript support for the config file
  • Added "Restart" command to restart the extension
  • Added different formats for the "Create Config" command (.ts, .js. .cjs, .mjs)
  • Moved the config loading from vscode-links-cli to the extension. The package is now deprecated. In replacement you can optionally install the vscl package to get typings and intellisense in your config.

Contribute

Feel free to open an issue or PR.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft