隨記

Week 04 · Day 02 — 建立多個模組

學習目標

  • 用 CLI 建立模組
  • 建立帶路由的模組
  • 理解模組化對大型專案的好處

重點

用 CLI 建立模組 

ng generate module admin
ng generate module shared

# 建立帶路由的模組
ng generate module admin --routing

模組分類（推薦做法） - 功能模組（Feature Module）：如 AdminModule，包某個功能的元件 - 共用模組（Shared Module）：如 SharedModule，放多處會用到的元件/管道 - 核心模組（Core Module）：放全局唯一的服務

為何要模組化 - 職責分離：每個模組只管自己的功能 - 易維護、易測試 - 可搭配「懶載入」（第九週）提升效能

範例 

ng g m admin --routing
ng g c admin/dashboard    # 元件建立在 admin 模組下（建在對應資料夾）
ng g c admin/report
產生 admin.module.ts（含 routing）。

實作

  1. 執行 ng g m admin --routing
  2. 執行 ng g m shared
  3. 開啟產生的 admin.module.ts，觀察結構與 --routing 多了什麼
  4. 在 admin 資料夾下建立 dashboard 元件

作業

  • 建立 admin 與 shared 兩個模組
  • 說出「功能模組」「共用模組」的差別
  • 解釋 --routing 選項會多做什麼