Egg 本地開(kāi)發(fā)

2020-02-06 14:11 更新

為了提升研發(fā)體驗(yàn)，我們提供了便捷的方式在本地進(jìn)行開(kāi)發(fā)、調(diào)試、單元測(cè)試等。

在這里我們需要使用到 egg-bin 模塊（只在本地開(kāi)發(fā)和單元測(cè)試使用，如果線上請(qǐng)參考 應(yīng)用部署）。

首先，我們需要把 egg-bin 模塊作為 devDependencies 引入：

$ npm i egg-bin --save-dev

啟動(dòng)應(yīng)用

本地啟動(dòng)應(yīng)用進(jìn)行開(kāi)發(fā)活動(dòng)，當(dāng)我們修改代碼并保存后，應(yīng)用會(huì)自動(dòng)重啟實(shí)時(shí)生效。

添加命令

添加 npm scripts 到 package.json：

{
  "scripts": {
    "dev": "egg-bin dev"
  }
}

這樣我們就可以通過(guò) npm run dev 命令啟動(dòng)應(yīng)用。

環(huán)境配置

本地啟動(dòng)的應(yīng)用是以 env: local 啟動(dòng)的，讀取的配置也是 config.default.js 和 config.local.js 合并的結(jié)果。

指定端口

本地啟動(dòng)應(yīng)用默認(rèn)監(jiān)聽(tīng) 7001 端口，可指定其他端口，例如：

{
  "scripts": {
    "dev": "egg-bin dev --port 7001"
  }
}

單元測(cè)試

這里主要講解工具部分的使用，更多關(guān)于單元測(cè)試的內(nèi)容請(qǐng)參考這里。

添加命令

添加 npm scripts 到 package.json：

{
  "scripts": {
    "test": "egg-bin test"
  }
}

這樣我們就可以通過(guò) npm test 命令運(yùn)行單元測(cè)試。

環(huán)境配置

測(cè)試用例執(zhí)行時(shí)，應(yīng)用是以 env: unittest 啟動(dòng)的，讀取的配置也是 config.default.js 和 config.unittest.js 合并的結(jié)果。

運(yùn)行特定用例文件

運(yùn)行 npm test 時(shí)會(huì)自動(dòng)執(zhí)行 test 目錄下的以 .test.js 結(jié)尾的文件（默認(rèn) glob 匹配規(guī)則 test/**/*.test.js ）。

我們?cè)诰帉?xiě)用例時(shí)往往想單獨(dú)執(zhí)行正在編寫(xiě)的用例，可以通過(guò)以下方式指定特定用例文件：

$ TESTS=test/x.test.js npm test

支持 glob 規(guī)則。

指定 reporter

Mocha 支持多種形式的 reporter，默認(rèn)使用 spec reporter。

可以手動(dòng)設(shè)置 TEST_REPORTER 環(huán)境變量來(lái)指定 reporter，例如使用 dot：

$ TEST_REPORTER=dot npm test

image

指定用例超時(shí)時(shí)間

默認(rèn)執(zhí)行超時(shí)時(shí)間為 30 秒。我們也可以手動(dòng)指定超時(shí)時(shí)間（單位毫秒），例如設(shè)置為 5 秒：

$ TEST_TIMEOUT=5000 npm test

通過(guò) argv 方式傳參

egg-bin test 除了環(huán)境變量方式，也支持直接傳參，支持 mocha 的所有參數(shù)，參見(jiàn)：mocha usage 。

$ # npm 傳遞參數(shù)需額外加一個(gè) `--`，參見(jiàn) https://docs.npmjs.com/cli/run-script
$ npm test -- --help
$
$ # 等同于 `TESTS=test/**/test.js npm test`，受限于 bash，最好加上雙引號(hào)
$ npm test "test/**/test.js"
$
$ # 等同于 `TEST_REPORTER=dot npm test`
$ npm test -- --reporter=dot
$
$ # 支持 mocha 的參數(shù)，如 grep / require 等
$ npm test -- -t 30000 --grep="should GET"

代碼覆蓋率

egg-bin 已經(jīng)內(nèi)置了 nyc 來(lái)支持單元測(cè)試自動(dòng)生成代碼覆蓋率報(bào)告。

添加 npm scripts 到 package.json：

{
  "scripts": {
    "cov": "egg-bin cov"
  }
}

這樣我們就可以通過(guò) npm run cov 命令運(yùn)行單元測(cè)試覆蓋率。

$ egg-bin cov

  test/controller/home.test.js
    GET /
      ? should status 200 and get the body
    POST /post
      ? should status 200 and get the request body

  ...

  16 passing (1s)

=============================== Coverage summary ===============================
Statements   : 100% ( 41/41 )
Branches     : 87.5% ( 7/8 )
Functions    : 100% ( 10/10 )
Lines        : 100% ( 41/41 )
================================================================================

還可以通過(guò) open coverage/lcov-report/index.html 打開(kāi)完整的 HTML 覆蓋率報(bào)告。

image

環(huán)境配置

和 test 命令一樣，cov 命令執(zhí)行時(shí)，應(yīng)用也是以 env: unittest 啟動(dòng)的，讀取的配置也是 config.default.js 和 config.unittest.js 合并的結(jié)果。

忽略指定文件

對(duì)于某些不需要跑測(cè)試覆蓋率的文件，可以通過(guò) COV_EXCLUDES 環(huán)境變量指定：

$ COV_EXCLUDES=app/plugins/c* npm run cov
$ # 或者傳參方式
$ npm run cov -- --x=app/plugins/c*

調(diào)試

日志輸出

使用 logger 模塊

框架內(nèi)置了日志 功能，使用 logger.debug() 輸出調(diào)試信息，推薦在應(yīng)用代碼中使用它。

// controller
this.logger.debug('current user: %j', this.user);

// service
this.ctx.logger.debug('debug info from service');

// app/init.js
app.logger.debug('app init');

通過(guò) config.logger.level 來(lái)配置打印到文件的日志級(jí)別，通過(guò) config.logger.consoleLevel 配置打印到終端的日志級(jí)別。

使用 debug 模塊

debug 模塊是 Node.js 社區(qū)廣泛使用的 debug 工具，很多模塊都使用它模塊打印調(diào)試信息，Egg 社區(qū)也廣泛采用這一機(jī)制打印 debug 信息，推薦在框架和插件開(kāi)發(fā)中使用它。

我們可以通過(guò) DEBUG 環(huán)境變量選擇開(kāi)啟指定的調(diào)試代碼，方便觀測(cè)執(zhí)行過(guò)程。

（調(diào)試模塊和日志模塊不要混淆，而且日志模塊也有很多功能，這里所說(shuō)的日志都是調(diào)試信息。）

開(kāi)啟所有模塊的日志：

$ DEBUG=* npm run dev

開(kāi)啟指定模塊的日志：

$ DEBUG=egg* npm run dev

單元測(cè)試也可以用 DEBUG=* npm test 來(lái)查看測(cè)試用例運(yùn)行的詳細(xì)日志。

使用 egg-bin 調(diào)試

添加命令

添加 npm scripts 到 package.json：

{
  "scripts": {
    "debug": "egg-bin debug"
  }
}

這樣我們就可以通過(guò) npm run debug 命令來(lái)斷點(diǎn)調(diào)試應(yīng)用。

egg-bin 會(huì)智能選擇調(diào)試協(xié)議，在 8.x 之后版本使用 Inspector Protocol 協(xié)議，低版本使用 Legacy Protocol。

同時(shí)也支持自定義調(diào)試參數(shù)：

$ egg-bin debug --inpsect=9229
  • master 調(diào)試端口為 9229 或 5858（舊協(xié)議）
  • agent 調(diào)試端口固定為 5800，可以傳遞 process.env.EGG_AGENT_DEBUG_PORT 來(lái)自定義。
  • worker 調(diào)試端口為 master 調(diào)試端口遞增。
  • 開(kāi)發(fā)階段 worker 在代碼修改后會(huì)熱重啟，導(dǎo)致調(diào)試端口會(huì)自增，參見(jiàn)下文的 IDE 配置以便自動(dòng)重連。

環(huán)境配置

執(zhí)行 debug 命令時(shí)，應(yīng)用也是以 env: local 啟動(dòng)的，讀取的配置是 config.default.js 和 config.local.js 合并的結(jié)果。

使用 DevTools 進(jìn)行調(diào)試

最新的 DevTools 只支持 Inspector Protocol 協(xié)議，故你需要使用 Node.js 8.x+ 的版本方能使用。

執(zhí)行 npm run debug 啟動(dòng)：

?  showcase git:(master) ? npm run debug

> showcase@1.0.0 debug /Users/tz/Workspaces/eggjs/test/showcase
> egg-bin debug

Debugger listening on ws://127.0.0.1:9229/f8258ca6-d5ac-467d-bbb1-03f59bcce85b
For help see https://nodejs.org/en/docs/inspector
2017-09-14 16:01:35,990 INFO 39940 [master] egg version 1.8.0
Debugger listening on ws://127.0.0.1:5800/bfe1bf6a-2be5-4568-ac7d-69935e0867fa
For help see https://nodejs.org/en/docs/inspector
2017-09-14 16:01:36,432 INFO 39940 [master] agent_worker#1:39941 started (434ms)
Debugger listening on ws://127.0.0.1:9230/2fcf4208-4571-4968-9da0-0863ab9f98ae
For help see https://nodejs.org/en/docs/inspector
9230 opened
Debug Proxy online, now you could attach to 9999 without worry about reload.
DevTools → chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9999/__ws_proxy__

然后選擇以下一種方式即可：

  • 直接訪問(wèn)控制臺(tái)最后輸出的 DevTools 地址，該地址是代理后的 worker，無(wú)需擔(dān)心重啟問(wèn)題。
  • 訪問(wèn) chrome://inspect，配置對(duì)應(yīng)的端口，然后點(diǎn)擊 Open dedicated DevTools for Node 即可打開(kāi)調(diào)試控制臺(tái)。

DevTools

使用 WebStorm 進(jìn)行調(diào)試

egg-bin 會(huì)自動(dòng)讀取 WebStorm 調(diào)試模式下設(shè)置的環(huán)境變量 $NODE_DEBUG_OPTION。

使用 WebStorm 的 npm 調(diào)試啟動(dòng)即可：

WebStorm

使用 VSCode 進(jìn)行調(diào)試

可以通過(guò) 2 個(gè)方式：

方式一：開(kāi)啟 VSCode 配置 Debug: Toggle Auto Attach，然后在 Terminal 執(zhí)行 npm run debug 即可。

方式二：配置 VSCode 的 .vscode/launch.json，然后 F5 一鍵啟動(dòng)即可。（注意，需要關(guān)閉方式一中的配置）

// .vscode/launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Egg",
      "type": "node",
      "request": "launch",
      "cwd": "${workspaceRoot}",
      "runtimeExecutable": "npm",
      "windows": { "runtimeExecutable": "npm.cmd" },
      "runtimeArgs": [ "run", "debug" ],
      "console": "integratedTerminal",
      "protocol": "auto",
      "restart": true,
      "port": 9229,
      "autoAttachChildProcesses": true
    }
  ]
}

我們也提供了一個(gè) vscode-eggjs 擴(kuò)展來(lái)自動(dòng)生成配置。

VSCode

更多 VSCode Debug 用法可以參見(jiàn)文檔: Node.js Debugging in VS Code

更多

如果想了解更多本地開(kāi)發(fā)相關(guān)的內(nèi)容，例如為你的團(tuán)隊(duì)定制一個(gè)本地開(kāi)發(fā)工具，請(qǐng)參考 egg-bin。


以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)