【多圖】模仿 egg.js 使用 koa2 搭建項目（一）

koajs 做爲一個很是優秀的框架，正在慢慢的替代 expressjs，雖然 expressjs 寶刀未老，不論是各個框架的 cli, 仍是其餘地方都依然堅挺着，但是就像 jQuery 同樣，大半江山正在慢慢的失守，爲了能繼續在公司看天花板，仍是趕忙先學起來先。

第一次來這裏寫文章，寫的很差，求輕噴

前言

最開始學 koa，驚訝其簡潔，甚至是簡陋的語法，以爲本身好像什麼都能幹，但是好像又什麼也幹不了。

其中最頭疼不是其洋蔥模型，而是經常使用的組件，好比路由和session就有好幾個推薦的，官方也調皮，一次維護兩，視圖組件如今都是本身瞎寫湊合着用，我的項目沒人管，隨便瞎搞了。

後面接觸了基於 koa 開發的框架 egg.js ，文檔的質量很是好，讓我這種 node 小白有眼前一亮的感受。

不事後續在編寫一些簡單的小應用，好比相似微信中控服務器，職責比較單一的小應用，就感受有點雞肋了，用了過於臃腫，不用又沒信心能維護好這一個應用，因此就本身研究 egg.js 經過模仿，慢慢的搭建屬於本身的一套模板出來。

第一步：拓展 KoaApplication 類

注意：這步拓展不是必須的，只是這樣使用會更加方便而已

後續須要用到一個 baseDir 的參數，這個是項目的根路徑，默認爲 process.cwd() 的值。

之因此須要這個，主要是用於約定的目錄查找，好比配置文件目錄的自動查找用，並且有了這個參數，用於能夠自定義應用路徑，這個在其餘框架，好比 python 的 flask 就比較能表明性的突出這個參數的重要性。

參考實現

第二步：解決不一樣環境的配置問題

參考 egg.js 的 config 介紹，實際上 egg 是經過維護 serverEnv 來實如今不一樣環境下加載不一樣的配置文件。同時，經過維護一個專門的環境變量 EGG_SERVER_ENV 來實現自定義加載配置文件的目的。

好比我有三個環境，分別是生產環境，本地開發環境和測試環境，那麼對應的配置文件就是 config.prod.js，config.local.js ，config.testing.js， 由於測試環境 egg 沒有提供支持，咱們能夠經過給環境變賦值 export EGG_SERVER_ENV=testing 的方式來支持測試環境的配置。

egg 還支持 .env 文件的讀取，能夠經過其添加自定義環境的支持, serverEnv 的源碼能夠看這裏.

這裏若是是通用的配置文件，能夠建立一個 config.default.js 的文件，將公共配置寫在這裏，這裏的配置會和當前環境的配置合併，成爲最終的配置文件，合併規則能夠看這裏。

參考實現

注意：這裏的只是貼出魔改的核心代碼，其餘代碼截圖時屏蔽了

由於存在多個配置來源，因此爲了方便查找問題，egg 會生成 application_config_meta.json 文件，用於定位配置的來源，config meta d的生成可看源碼

第三步：定義目錄結構

這裏僅僅是參考 eggjs 的目錄結構，並無強約定，由於不想過重了，若是真的須要，直接使用 eggjs 會更好。

第四步：編寫應用入口，服務啓動腳本和路由定義文件

應用的入口文件和服務的啓動腳本文件是我按本身的想法分開的，主要是用於分離本地開發引入的插件和線上運行的插件，好比本地開發能夠引入 mockjs 和 代理插件，寫個中間件在bin/local掛載 文件那裏，這樣生產環境中只要接口刪除就不用去處理開發的代碼了

app.js

bin/serve

local 只是添加了開發依賴的插件而已，啓動邏輯同樣

app/router.js

site.js 適用於渲染官網頁面的

配置文件編寫可參考 egg.js，和其的用法保持一致，這樣就不用寫文檔了，機智如我(●ˇ∀ˇ●)。

第五步：編寫啓動腳本

開發使用 nodemon 來啓動服務，生產環境我是使用 pm2 來啓動服務的。

package.json

package.js 文件裏面引入了 husky 和 lint-staged 來進行本地代碼檢查，使用 npm version 來管理軟件版本和 git tag 的自動生成，使用 standard ( standard 最新版已集成 eslint ) 來格式化 js 代碼

nodemon.json

之前我用 supervisor 的，這個第一次用，還挺好用的 (●ˇ∀ˇ●)，就是還沒試過 js api，json 配置不夠靈活，使用 js 就沒這問題。

pm2.config.js

由於語言組織能力比較差，因此以圖片代替，代碼後面等整理後再上傳。

看到掘金這麼多推 vs 插件的，我也來推個，應該不少人都推過了，如下插件 是 webstorm 遷移 vscode 必備插件，下降適應時間

• 代碼運行
• Git 歷史
• Git 歷史2
• 路徑自動補全
• 本地文件歷史
• webstorm 按鍵映射
• JavaScript Standard Style, 推薦設置 standard.autoFixOnSave 爲 true

下一篇：灰機地址