symfony2管理css後,css定義有背景圖片,symfony2改變了css的路徑,卻沒有改變css內定義的背景圖片的路徑,導致背景圖片無法顯示,怎麼辦?先謝謝大家了!
淡淡烟草味2017-05-16 16:46:10
如果你是使用的 Assetic 的話,那麼你需要加入 cssrewrite fileter,即:
{% stylesheets 'bundles/app/css/*' filter='cssrewrite' %}
這個過濾器是什麼意思呢?
在你assets:dump(或assets:install) 的時候,Symfony2 會將你的靜態檔案(CSS)從Bundle 移出到Web 根目錄,因此有些檔案的路徑就改變了(例如在css中引用的圖像),從而導致了主題所說的問題。
因此 cssrewrite 濾鏡就是專門用來計算 css 與圖片之間的相對關係,並直接更新 CSS 中的路徑。
跟你舉個實際應用中的例子,你現在有兩個檔案 logo.png 和 style.css:
/src/AppBundle/Resources/public/img/logo.png
/src/AppBundle/Resources/public/css/style.css
你在 style.css 裡引用 logo.png 需要 ../img/logo.png,對吧?
現在,當你assets:dump 時,Symfony2 的Assetic 元件會將logo.png 和style.css 匯出到/web 目錄,因為/src 下是不能直接存取的,現在logo.png 和style.css 將會被匯出在新目錄:
/web/bundles/app/img/logo.png
/web/css/11e4a17.css
你會看到,11e4a17.css(style.css 被重新命名後的檔案) 和logo.png 的相對關係已經發生了變化,原先的../img/logo.png 已經不能引用到logo.png 了,cssrewrite 的意義就在於,它將更新11e4a17.css(style.css)中的../img/logo.png 為../bundles/app/img/logo.png。
囉嗦說這麼多,希望能幫到題主。