2012-06-13 30 views
4

有什麼我可以使用的,它可以快速地將多個CSS導入合併到一個CSS文件中。將開發CSS中的導入合併到一個文件中用於生產

例如,假設我有一個發展過程中有大量進口的主要styles.css的文件:

@import url('normalize.css'); 
@import url('1.css'); 
@import url('2.css'); 
... 
@import url('10.css'); 

我只是爲我自己的理智發展過程中把它們分開。

我想,雖然生產1種樣式文件,而不是11,12等

所以在儘量減少HTTP請求,是有什麼,比其他手動複製/粘貼到一個文件中,可以把這些導入到1個文件?

LESS或SASS做這樣的事嗎?

+2

值得指出的是,儘量減少HTTP請求是好的,但緩存是更好的。如果瀏覽器緩存了「normalize.css」,則不必發出HTTP請求。您可能希望有一個CSS文件具有在每個頁面上使用的樣式,而另一個樣式則使用頁面特定的樣式。這樣,您的後續頁面就可以使用緩存的基本樣式,只下載少數幾頁特定的樣式。 – maxbeatty

回答

1

LESS和SASS做這個和更多。有許多服務器端的方法來整理您的css文件到一個單一的文件(少可以做到這一點,與js太多,但我不會推薦這個,因爲你會失去你的造型與js關閉)

雅虎YUI壓縮機/犀牛做同樣的,如果我沒有記錯:http://developer.yahoo.com/yui/compressor/#work

如果選中全局選項,這一個對你的作品:

-o outfile中

​​
+2

不幸的是,yui-compressor確實不會那樣做。 –

+0

@JoachimBreitner你能詳細說明一下嗎?我沒有使用YUI壓縮器連接文件,但文件看起來很清楚這個選項。 – Luca

+0

不知道這是否可以在評論中正確呈現: '''''cat test2.css @import url(test.css); $貓test.css 一個{字體重量:重} $銳壓縮機test2.css @進口網址(test.css);''' 這是2.4.7版本。 –

0

使用YUI壓縮機最簡單的方法是下載二進制文件,其中需要 Java,並在命令行上執行它們:

java -jar yuicompressor-x.y.z.jar foo.js | foo.min.js

但是,您可以在部署中以編程方式執行此操作。如果您使用像鏈輪或更少的庫 ,他們會爲您做這個。否則,有幾個接口庫可用於YUI壓縮器,如Sam Stephenson的Ruby-YUI壓縮器gem或Jammit庫中的 。

+0

不幸的是,yui-compressor確實不是* inline @ import的。 –

相關問題