2016-09-30 102 views
1

應用程序是在Angular2 RC5中創建的。在RC5(沒有webpack)一切正常。圖像按預期顯示。如何使用Webpack在Angular2中使用圖像

在與Webpack一起升級到Angular 2.0.0的最終版本後,我的公用文件夾中的圖像不再在應用程序的任何位置工作。使用Angular CLI通過使用Webpack創建新的Angular2安裝來完成升級。

http://localhost:4200/images/thumbs/2016/09/16/IMG_3879.jpg 404 (Not Found) 

相同的確切路徑在RC5中正常工作。爲了能夠看到/ public/images文件夾中的圖像(他們在RC5中的工作位置),還是應該在何處放置圖像,需要做些什麼?

在我的模板,我與調用圖片:

<img class="img-responsive" [src]="asset.thumb_local_path" > 

回答

0

經過一番更多搜尋,似乎圖像文件夾必須被放置無論是src文件夾或資產的文件夾內。在RC5中情況並非如此。將所有圖像/視頻/等移動到/ assets文件夾後,我現在可以在瀏覽器中看到它們。

+0

問題是,在現實世界中,部分圖像被'Base64' url使用。 'url-loader'可以將圖像轉換爲'base64'網址。所以,複製整個圖像目錄沒有任何意義。怎麼樣的圖像大小隻是'1kb'?你真的想發送一個請求到服務器嗎? – novaline