Home

Awesome

Deno for Visual Studio Code

GitHub Workflow Status

Visual Studio Marketplace Version Visual Studio Marketplace Installs Visual Studio Marketplace Downloads Visual Studio Marketplace Rating (Stars)

<img align="right" src=https://raw.githubusercontent.com/denoland/vscode_deno/main/deno.png height="150px">

This extension adds support for using Deno with Visual Studio Code, powered by the Deno language server.

⚠️ Important: You need to have a version of Deno CLI installed (v1.13.0 or later). The extension requires the executable and by default will use the environment path. You can explicitly set the path to the executable in Visual Studio Code Settings for deno.path.

Check here for instructions on how to install the Deno CLI.

Basic Usage of the Extension

Features

Usage

  1. Install the Deno CLI.
  2. Install this extension.
  3. Ensure deno is available in the environment path, or set its path via the deno.path setting in VSCode.
  4. Open the VS Code command palette with Ctrl+Shift+P, and run the Deno: Enable command.

We recognize that not every TypeScript/JavaScript project that you might work on in VSCode uses Deno — therefore, by default, this extension will only apply the Deno language server when the setting deno.enable is set to true. This can be done via editing the settings or using the command Deno: Initialize Workspace Configuration.

While you can enable Deno globally, you probably only want to do that if every JavaScript/TypeScript workspace you work on in VSCode is a Deno based one.

Commands

The extension provides several commands:

Formatting

The extension provides formatting capabilities for JavaScript, TypeScript, JSX, TSX, JSON and markdown documents. When choosing to format a document or setting up a default formatter for these type of files, the extension should be listed as an option.

When configuring a formatter, you use the extension name, which in the case of this extension is denoland.vscode-deno. For example, to configure Deno to format your TypeScript files automatically on saving, you might set your settings.json in the workspace like this:

{
  "deno.enable": true,
  "deno.lint": true,
  "editor.formatOnSave": true,
  "[typescript]": { "editor.defaultFormatter": "denoland.vscode-deno" }
}

Or if you wanted to have Deno be your default formatter overall:

{
  "deno.enable": true,
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "denoland.vscode-deno"
}

Troubleshoot: If you choose this option, ensure your user settings don't have any language-specific settings set for this. VSCode will add this automatically in some cases:

// User `settings.json`:
{
  // Remove this:
  "[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  }
}

The formatter will respect the settings in your Deno configuration file, which can be explicitly set via deno.config or automatically detected in the workspace. You can find more information about formatter settings at Deno Tools - Formatter.

ℹ️   It does not currently provide format-on-paste or format-on-type capabilities.

Configuration

You can control the settings for this extension through your VS Code settings page. You can open the settings page using the Ctrl+, keyboard shortcut. The extension has the following configuration options:

Compatibility

To see which versions of this extension can be used with each version of the Deno CLI, consult the following table.

Deno CLIvscode-deno
1.40.0 onwards3.40.0 onwards
1.37.2 - 1.39.43.34.0 - 3.39.0
1.37.13.32.0 - 3.33.3
1.37.03.28.0 - 3.31.0
? - 1.36.43.27.0

Version ranges are inclusive. Incompatibilites prior to 3.27.0 were not tracked.

Contribute

Learn how to setup & contribute to this project

Thanks

This project was inspired by justjavac/vscode-deno and axetroy/vscode-deno. Thanks for their contributions.

License

The MIT License