- 進入專案目錄,先安裝node_module依賴
npm i
- 本地啟動專案
npm run dev
npm run build
npm run start
- 執行server端
src/index.ts
- webpack起動編譯(做出main跟chatRoom頁面)
- 使用者在瀏覽器發起對應
dev.ts
裡的url請求 - sever回傳對應的頁面(由webpack編譯好的client頁面)
- (client端)HTML5頁面
npm run build
-> 建立client資源- 過程: 2-1. Webpack編譯TS+CSS+main.html -> Main頁面 2-2. Webpack編譯TS+CSS+chatRoom.html -> chatroom頁面
- (Server端)Node Server
-
啟動express server
-
判斷當前process.env.NODE_ENV環境: 4-1 本地開發走
dev.ts
, 4-2 線上環境走prod.ts
-
user從瀏覽器(client端)對Node Server請求頁面:
localhost:3000/main
localhost:3000/chatroom
dev.ts -> 重定向到main/main.html跟chatRoom/chatRoom.html
prod.ts -> 直接返回main/main.html跟chatRoom/chatRoom.html
```# ts-chat-app