適用於Angular應用程序和組件的Scss結構

Question

我在使用ng服務提供應用程序時遇到錯誤。腳註中的scss文件引用資產中的styles.css。但是，某些scss文件使用諸如來自assets/styles/styles.css的背景（../ icons/icon.svg）之類的相對路徑從圖標引用svgs。當此文件由footer.component.scss導入時，路徑中斷。它試圖引用該文件夾中不存在的src/app/layouts/icons/icon.svg，但存在於src/assets/icons下。

├── app 
| ├── layouts 
|  |──footer 
|   ├── footer.component.ts 
|   ├── footer.component.scss 
| 
├── assets 
| ├── icons 
| ├── css 
|  |──pallette.scss 
|  |──_helpers.scss 
|  |──styles.scss 

我想實現的是具有可用於其他項目共享組件的模塊化應用的目標等，有可能是一個完全不同的結構和處理方法做這個，我向所有人開放建議。

Answer 1

../icons/icon.svg不是正確的路徑。

嘗試與/assets/icons/icon.svg它應該工作。