Assets 資料夾

Assets 資料夾設定

1. 位置：

   • 需手動在 src/ 下建立 assets 資料夾

   • 用於存放靜態資源：圖片、字體、JSON 等

2. 在 angular.json 中配置：

"assets": [
  "src/assets",          // 基本資源目錄
  {
    "glob": "**/*",      // 所有檔案
    "input": "public"    // 額外的資源目錄
  }
]

資源引用規則

1. 圖片引用：

<!-- 正確：使用絕對路徑 -->
<img src="assets/logo.png" alt="logo">

<!-- 錯誤：避免使用相對路徑 -->
<img src="../../../assets/logo.png" alt="logo">

1. CSS 中引用：

.logo {
  background-image: url('assets/logo.png');
}

重要注意事項

1. 設定變更後需重啟開發伺服器：

ng serve

1. 檔案命名建議：

   • 使用小寫

   • 單字間用連字號 (-)

   • 清楚描述資源用途

2. 常見問題處理：

   • 404 錯誤：檢查路徑是否正確

   • 大小寫敏感：確保檔名完全匹配

   • 路徑問題：使用絕對路徑而非相對路徑