我為 VS Code 開發了一個 Deno 外掛

justjavac發表於2019-03-08

這幾天為 Deno 開發了一個 VS Code 外掛:Deno support for VSCode,GitHub 地址:github.com/justjavac/v…

自 Deno 釋出以來就備受關注,也有很多媒體和開發者稱 Deno 為“下一代 Node.js”。然而 Deno 的目標則是不相容 Node.js,沒有 npm,沒有 package.json。

Deno 的目標旨在提供一個相容瀏覽器的平臺,因此 Deno 可以像瀏覽器的 ES Modules 那樣,通過 URL 載入模組:

import * as log from "https://deno.land/x/std/log/mod.ts";
複製程式碼

而且在載入模組時不能省略副檔名

但是,目前的所有開發工具都是為 Node.js 而構建的。在 TypeScript 中,我們不需要新增 .ts 副檔名。如果我們新增了,VS Code 會給我們一個錯誤提示:

ts(2691): An import path cannot end with a '.ts' extension. Consider importing './hello' instead.

我為 VS Code 開發了一個 Deno 外掛

而另一個問題則是,Deno 可以載入遠端模組,但是 TypeScript 卻不行。比如上面的程式碼,也是會報錯的:

ts(2307): Cannot find module 'https://deno.land/x/std/log/mod'.

我為 VS Code 開發了一個 Deno 外掛

而這個外掛正是為了解決這 2 個問題。

但是這兩個錯誤不是 VS Code 提供了,而是 TypeScript 的編譯器 tsc 提供的,因此需要修改 tsc 的功能。好訊息是,TypeScript 從 2.3 開始便支援了 Language Service Plugin,這個功能僅能增強編輯體驗,無法改變 TypeScript 核心行為(比如改變型別檢查行為)或增加新特性(比如提供一種新語法或者)。通過檢視 Language Service Plugin 的說明檔案,這個功能正是我需要的。

所以在寫這個 VS Code 外掛之前,我又為 TypeScript 寫了一個外掛:typescript-deno-plugin。這個外掛不僅可以用在 VS Code,還可以用在任何支援 TypeScript 的編輯器,比如 Atom、Visual Studio、WebStorm 等。

VS Code 外掛提供了開箱即用的 Deno 支援,開發者不需要任何配置,但是有一個前提是:開發者需要使用 VS Code 內建的 TypeScript。如果你在專案中自行安裝了 TypeScript,並且修改了 VS Code 的配置,使用了自己安裝的版本,則需要自行安裝配置 typescript-deno-plugin 外掛。通過修改 tsconfig.jsonplugins

{
  "compilerOptions": {
    "plugins": [
      {
        "name": "typescript-deno-plugin"
      }
    ]
  }
}
複製程式碼

如果你正在打算學習 Deno 的開發,可以通過這個連結 Deno support for VSCode 安裝外掛。

祝,開發愉快。

相關文章