天天看點

Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)

今天開始從零搭建後端架構,後端架構基于Koa2,通過Typescript語言編寫。

在寫後端架構之前,自己也了解過Express,感覺Koa2更加靈活,由于有多年後端研發經驗,是以采用Koa2,簡單靈活靈活。

1. 安裝Koa2

首先要安裝Node.js,這個就不贅述,安裝最新版即可。開發IDE使用VisualStudio Code,絕對推薦。

使用vs code打開自己建立的server檔案夾,使用控制台指令行,敲入以下指令:

1.1 初始化package.json檔案:(根據提示回車)

1.2 安裝Koa2:

1.3 添加index.js檔案,嘗試第一次運作Koa2,敲入以下代碼

1.4 然後F5運作,打開浏覽器,輸入localhost:3000,如下圖

Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)

2. 安裝Typescript

由于我個人比較喜歡TS,是以想嘗試使用,對後期開發都有好處(前端也用TS,TS流行啊)。

2.1 全局安裝TS

2.1 添加TS配置檔案:tsconfig.json

執行後,會出現tsconfig.json檔案

2.2 打開tsconfig.json,進行配置

2.3 安裝@types/node

2.4 修改index.js為index.ts,修改内部代碼 

2.5  通過F5直接在vs code中進行調試,Ctrl + Shift + B(windows),建立task.json

2.6 在vs code 右側,debug模式,添加配置

Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)

2.7 自動生成launch.json檔案,修改為:

2.8 按F5運作,控制台輸出和頁面顯示如下:

Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)
Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)

附:文檔結構如圖

Vue2+Koa2+Typescript前後端架構教程--01後端Node.js架構搭建(安裝調試KOA2)
上一篇: js數組去重