Deno極速入門

推薦閱讀官方手冊

起步

安裝

鑑於國內的網速原因，@justjavac 大佬搞了國內的鏡像加速：

Mac/Linux

curl -fsSL https://x.deno.js.cn/install.sh | sh

Windows

iwr https://x.deno.js.cn/install.ps1 -useb -outf install.ps1; .\install.ps1
# iwr https://x.deno.js.cn/install.ps1 -useb | iex

設置環境變量

deno 沒有 node 中的 node_modules 目錄做爲包存放的地方，但也需要一個地方存在安裝的模塊：

DENO_DIR 默認爲 $HOME/.deno，就是 Deno 存放生成的代碼和緩存的源碼的路徑。

# mac / linux
echo 'export DENO_DIR=$HOME/.deno' >> ~/.bash_profile
source ~/.bash_profile # 如果是 zsh 則：source ~/.zshrc

安裝 VSCode 插件

由於 import url 的形式和 Deno 全局對象並未被 vscode 支持，所以需要藉助插件 Deno 進行支持：

1. 在您的項目文件夾中創建文件.vscode/settings.json；
2. 在settings.json文件中加入以下內容。

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

hello world

deno run https://deno.land/std/examples/welcome.ts

不出意外的話，你會看到：

Download https://deno.land/std/examples/welcome.ts
Compile https://deno.land/std/examples/welcome.ts
Welcome to Deno 🦕

如果重新執行一遍，你會看到 Download 和 Compile 過程沒了，直接是結果：

Welcome to Deno 🦕

深入

Deno 內置 API 使用

首先我們來看一下讀取文件目錄的例子：

const dir = Deno.readDirSync(Deno.cwd())
for (const file of dir) {
	console.log(file)
}

這段代碼的含義是：Deno.cwd() 表示當前目錄，Deno.readDirSync 表示讀取目錄信息，並返回一個可迭代對象，我們使用 for of 進行輸出。執行命令一下命令即可看到結果：

deno run --allow-read mod.ts
{ name: "mod.ts", isFile: true, isDirectory: false, isSymlink: false }
{ name: ".vscode", isFile: false, isDirectory: true, isSymlink: false }
{ name: "server.ts", isFile: true, isDirectory: false, isSymlink: false }

首先我們看到 deno 並未像 node 一樣使用引入模塊的方式，而是採用全局的 Deno 對象，我們輸出即可看到全部內置 API：

console.log(Deno);

我們使用 vscode 插件單擊 Deno 對象即可跳轉其 ts 定義：

如果覺得是英文看不懂，則可以參考或替換中文版。

如果仍然覺得不夠直觀，可以參考 typedoc：中文 或 英文

支持 TS

在 Deno 中，TS 和 JS 都是一等公民，都可以完美支持。例如：

// index.ts
let name: string = 'ry'
name = 123

> deno run index.ts

結果

Compile file:///Users/Xiuming/Desktop/demo/index.ts
error: TS2322 [ERROR]: Type '123' is not assignable to type 'string'.
name = 123;
~~~~
    at file:///Users/Xiuming/Desktop/demo/index.ts:2:1

權限

Deno 默認是沒有 網絡、文件讀、文件寫、環境變量讀取等權限，需要顯示的指明，例如：

// index.js
// 獲取數據
fetch('http://jsonplaceholder.typicode.com/posts/1')
.then((res) => res.json())
.then((data) => {
	console.log(data)
})

deno run index.js

執行後，發現一串報錯：

error: Uncaught PermissionDenied: network access to "http://jsonplaceholder.typicode.com/posts/1", run again with the --allow-net flag

我們加上權限試試：

deno run --allow-net index.js
{
 userId: 1,
 id: 1,
 title: "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
 body: "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas..."
}

如果覺得麻煩，可以使用 -A 參數允許全部權限。

import URL

Deno 相對於 NodeJS 一大亮點是沒有 node_modules，沒有 package.json，通過 import URL 的形式進行第三方模塊的引用：

import { white, bgRed } from "https://deno.land/std/fmt/colors.ts";

console.log(bgRed(white("你好，世界")));

deno run --allow-net mod.ts 
Compile file:///Users/Xiuming/Desktop/demo/mod.ts
Download https://deno.land/std/fmt/colors.ts
你好，世界 # 假裝有顏色

雖然看似簡單了，但也細心的你會發現很多問題：

1.有 Compile 和 Download 的過程，速度慢？

其實它只會在第一次執行的時候需要下載，然後會將其緩存起來，你重新執行，就會發現速度還是很快的：

deno run mod.ts
你好，世界 # 假裝有顏色

2.沒有網絡怎麼辦？

上面說的，在第一次下載後，Deno 會將其緩存起來，具體緩存目錄就是我們前面設置的環境變量 $HOME/.deno，我們可以使用 tree 命令看一下：

tree $HOME/.deno
/Users/Xiuming/.deno
├── deps
│   └── https
│       └── deno.land
│           ├── 3574883d8acbaf00e28990ec8e83d71084c4c668c1dc7794be25208c60cfc935
│           └── 3574883d8acbaf00e28990ec8e83d71084c4c668c1dc7794be25208c60cfc935.metadata.json
└── gen
    # ...

13 directories, 8 files

如果我們需要將代碼部署到一個沒有外網訪問的環境，可以直接將此目錄下的內容拷貝到相應的目錄，並將環境變量指定到目錄即可。

當然，如果是你在安裝依賴第三方依賴，例如 https://deno.land 宕機了，那隻能 GG，沒得辦法（PS：概率很小，就像 npmjs.com 宕機你也不能安裝包一樣）。

3.如何更新依賴？

如果依賴的文件更新了，我們可以通過 --reload 命令進行更新，還可以通過白名單的形式，只更新部分依賴：

deno run --reload=https://deno.land mod.ts

異步操作返回 Promise

Deno 中異步操作都是返回的 Promise 對象，並且支持 top-level-await，例如：

const file = await Deno.create("./foo.txt");
console.log(file);

標準模塊

Deno 爲開發者提供了一個沒有外部依賴的、實用的、高頻的開發庫，減輕我們開發的負擔：

• node：node API 兼容模塊；
• io：二進制讀寫操作；
• http：網絡和 web 服務相關；
• path：文件路徑相關；
• colors：輸出有顏色的文字，類似 chalk 庫；
• printf：格式化輸出，類似 C 語言的 printf；
• tar：解壓與壓縮；
• async：生成異步函數的；
• bytes：二進制比較和查找等；
• datetime：日期相關；
• encoding：文本的與二進制的轉化、CSV和對象轉化、yarml 和對象轉化等；
• flags：命令行參數解析；
• hash：字符轉 sha1 和 sha256；
• fs：文件系統模塊，類似 node 的 fs 模塊；
• log：日誌管理；
• permissions：權限相關；
• testing：測試和斷言相關；
• uuid：用於生成 UUID；
• ws：WebSocket 相關；

這個庫會根據實際需要不斷的完善和擴充，大家也可以貢獻自己的一分力量。

內置工具

Deno 本着去開發依賴的思想，提供了一組實用的工具：

• deno bundle: 打包文件
• deno fmt: 格式化
• deno lint: 代碼檢查（還未實現）
• deno test: 測試

deno bundle

你可以理解爲 webpack 打包文件一樣：

// foo.ts
const obj = { name: 'foo' }
export default obj

# 打包
deno bundle foo.ts foo.bundle.js

// index.js 引入打包後的文件
import foo from './foo.bundle.js'
console.log(foo)

deno run index.js
{ name: "foo" }

deno fmt

你可以理解爲 Prettier 的功能：

# 創建一個文件
# 注意左側有空格
echo "console.log( 'foo')" > index.js

# 格式化
deno fmt index.js

# 查看文件
cat index.js
console.log("foo"); # 左側空格沒了 😊

deno test

你可以理解爲 Jest 的功能：

// 引入斷言模塊
import { assertEquals } from "https://deno.land/std/testing/asserts.ts";

Deno.test("hello test", () => {
  const x = 'hello' + ' test';
  assertEquals(x, 'hello test');
});

學習和資料

• 官網: 權威一手信息；
• 入門文檔：從瞭解到入門；
• 標準模塊：萬物之源；
• 第三方模塊：羣英薈萃；
• 國內安裝加速：告別安裝慢；
• 中文手冊：英語犯困者的福音；
• ts 定義中文：同上，中文解釋的 ts 定義。