Morioh
Login
Welde Tekle

Welde Tekle

4 years ago

Visual Studio Code plugin for Deno

Visual Studio Code Deno extension

Adds Deno support for the Visual Studio Code.

screenshot

Features:

Full intellisense support

Deno Support

Intelligent module import

Import

Intelligent module import enhanced

Import enhanced

Supports importing ECMAScript modules

Import

Diagnostics and quick fixes

Diagnostics

Optional use of Deno’s built in formatting

Format

Client/Server model with LSP

The extension separates Client/Server with LSP

This means that complicated problems are handled on the server-side

The extension won’t block your Visual Studio Code

Process

Supports Import Maps for Deno

import_map

External type definitions

The extension supports the following ways to load external declaration files

These are all supported by Deno

  1. Compiler hint
// @deno-types="./foo.d.ts"
import { foo } from "./foo.js";

see example

  1. Triple-slash reference directive
/// <reference types="https://raw.githubusercontent.com/date-fns/date-fns/master/typings.d.ts" />

import { format } from "https://deno.land/x/date_fns/index.js";

format(new Date(), "yyyy/MM/DD");

see example

  1. X-TypeScript-Types custom header
import { array } from "https://cdn.pika.dev/fp-ts";

const M = array.getMonoid<number>();
console.log("concat Array", M.concat([1, 2], [2, 3]));

Usage

  1. Download and enable the extension from the Visual Studio Marketplace

  2. Enable Deno for your project:

    Create a file .vscode/settings.json in your project folder:

    // .vscode/settings.json
{
  "deno.enable": true,
}

  3. Enjoy!

Configuration

  • deno.enable - Enable extension. Default is false

  • deno.import_map - The file paths of Import Map. Default is null

  • deno.unstable - If Deno’s unstable mode is enabled. Default is false

  • deno.lint - If inline deno lint diagnostics are enabled. Because this is experimental, deno.unstable = true is required. Default is false

We recommend that you do not set global configuration. It should be configured in .vscode/settings.json in the project directory:

// .vscode/settings.json
{
  "deno.enable": true,
  "deno.import_map": "./path/to/import_map.json",
  "deno.unstable": false,
}

This extension also provides Deno’s formatting tools, settings are in .vscode/settings.json:

// .vscode/settings.json
{
  "[typescript]": {
    "editor.defaultFormatter": "denoland.vscode-deno",
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "denoland.vscode-deno",
  },
}

This extension also provides inline deno lint diagnostics. You can enable this in .vscode/settings.json:

NOTE: Since deno lint is still an experimental feature, you need to set deno.unstable = true in your VS Code settings. This function may change in the future.

// .vscode/settings.json
{
  "deno.enable": true,
  "deno.unstable": true,
  "deno.lint": true,
}

Contribute

Follow these steps to contribute, the community needs your strength.

  1. Fork project

  2. Clone onto your computer:

    $ git clone https://github.com/your_github_name/vscode_deno.git
$ cd vscode_deno
$ npm i

  3. Disable extension in Visual Studio Code if you have extension before

  4. Compile the extension:

    $ npm run compile # or `npm run watch` to automatically recompile on changes

  5. Start debug extension

    Open Visual Studio Code, find the Run item in the sidebar and then run Client + Server task. If you see the error Errors exist after running preLaunchTask 'undefined'., press Continue anyway.

    Wait for Visual Studio Code debugger to open a new window

  6. Try updating Visual Studio Code and restart the debugger

  7. Finally, push to your fork and send a PR

Thanks

This project was originally a fork of justjavac/vscode-deno and axetroy/vscode-deno. Thanks for their contributions.

Download Details:

Author: denoland

Demo: https://marketplace.visualstudio.com/items?itemName=denoland.vscode-deno

Source Code: https://github.com/denoland/vscode_deno

#deno #nodejs #node #javascript

Visual Studio Code plugin for Deno
8.70 GEEK