資產管道需求和CSS中的相對圖像路徑

資產/樣式表/真棒庫/真棒，library.css

，我們看到像

background-image: url("some-image.png")

，如果我們將在我們的佈局這樣寫：

<%= stylesheet_link_tag "awesome-library/awesome-library" %>

瀏覽器將獲取http://example.org/assets/awesome-library/some-image.png

但是，如果我們需要awesome-library/awesome-library在我們的application.css中：

//= require awesome-library/awesome-library

瀏覽器將獲取http://example.org/assets/一些-image.png（當然404）

我試圖重寫真棒，library.css到SCSS（使用圖像的URL），但在結果的CSS網址像/assets/some-image.png。我不想合併庫的圖像和所有其他圖像，實際上，不想更改庫的代碼。

來源

2011-11-06 r-k

就在您的application.css

來源

2011-11-06 12:51:02 Gerben

回答得好使用@import "awesome-library/awesome-library.css";，但是...我需要真棒，library.css添加到資產編譯列表，瀏覽器也將真正獲取2個CSS文件（以及因此不存在使用'stylesheet_link_tag'和你的我的實現之間的真正區別） –

不同的是，我的解決方案不以任何方式改變html。它只需要一個額外的http請求。但是你究竟想要達到什麼？ – Gerben

我想要一種方法來實現積極的緩存（所以用戶只會加載**一個文件**，直到任何一個css改變，用戶不會對服務器發出新的css請求）。同樣在你的想法中，在css文件名中沒有指紋，所以我不能告訴用戶「嘿，保存這個文件100年，不要再抓取它」。（但是，是的，我可以在application.css.erb中使用類似'@import「<％= asset_path（」awesome-library/awesome-library.css「）％>」;'）來實現指紋。所以目前我使用這種方式（@import + asset_path），thx給你。但是如果我們可以將所有的css封裝在一個文件中會更好。 –

資產管道需求和CSS中的相對圖像路徑

回答

相關問題