r.js來(lái)合并壓縮css文件的示例
如何使用r.js來(lái)合并壓縮css文件。在r5下新建一個(gè)css文件夾,里面有四個(gè)css文件:main.css、nav.css、form.css、grid.css。
main.css是合并的主文件,或稱配置文件。要合并的文件使用@import引入。如下
main.css
@importurl("nav.css"); @importurl("grid.css"); @importurl("form.css");
另外三個(gè)是普通的css文件,里面定義的各種樣式。這里不貼代碼了。這里將使用命令行將這四個(gè)文件合并后生成到r5/css/built.css。
node r.js -o cssIn=css/main.css out=css/built.css
這時(shí)回到r5/css目錄會(huì)發(fā)現(xiàn)多了一個(gè)built.css文件,該文件是另外四個(gè)css文件的合并項(xiàng)。
還可以使用optimizeCss參數(shù)設(shè)置來(lái)配置是否壓縮及壓縮選項(xiàng)。optimizeCss的取值有standard/none/standard.keepLines/standard.keepComments/standard.keepComments.keepLines。
none 不壓縮,僅合并
standard 標(biāo)準(zhǔn)壓縮 去換行、空格、注釋
standard.keepLines除標(biāo)準(zhǔn)壓縮外,保留換行
standard.keepComments除標(biāo)準(zhǔn)壓縮外,保留注釋
standard.keepComments.keepLines除標(biāo)準(zhǔn)壓縮外,保留換行和注釋
示例:
node r.js -o cssIn=css/main.css out=css/built.css optimizeCss=standard
壓縮后built.css整個(gè)為一行了。
總結(jié):
1,對(duì)于path配置的非本地的模塊文件,使用r.js合并壓縮時(shí)需要配置paths.xx=empty:。
2,cssIn和optimizeCss參數(shù)的使用來(lái)合并壓縮css文件。
總結(jié)
以上所述是小編給大家介紹的r.js來(lái)合并壓縮css文件的示例,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
boostrap模態(tài)框二次彈出清空原有內(nèi)容的方法
今天小編就為大家分享一篇boostrap模態(tài)框二次彈出清空原有內(nèi)容的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08JavaScript實(shí)現(xiàn)廣告的關(guān)閉與顯示效果實(shí)例
這篇文章主要介紹了JavaScript實(shí)現(xiàn)廣告的關(guān)閉與顯示效果,涉及javascript廣告窗口的關(guān)閉與顯示效果實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-07-07詳談innerHTML innerText的使用和區(qū)別
下面小編就為大家?guī)?lái)一篇詳談innerHTML innerText的使用和區(qū)別。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08Javascript 5種方法實(shí)現(xiàn)過(guò)濾刪除前后所有空格
這篇文章主要介紹Javascript 5種過(guò)濾刪除前后所有空格的方法,比較實(shí)用,需要的朋友可以參考下。2016-06-06關(guān)于對(duì)async?await效率問(wèn)題的深入思考
這篇文章主要給大家介紹了關(guān)于對(duì)async?await效率問(wèn)題的深入思考,async和await要搭配Promise使用,它進(jìn)一步極大的改進(jìn)了Promise的寫法,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-01-01javascript完整操作Table的增加行,刪除行的列子大全
非常漂亮的js操作table行代碼函數(shù)。比較方便2008-10-10新手入門帶你學(xué)習(xí)JavaScript引擎運(yùn)行原理
這篇文章主要介紹了新手入門帶你學(xué)習(xí)JavaScript引擎運(yùn)行原理,JavaScript引擎是一個(gè)專門處理JavaScript腳本的虛擬機(jī),一般會(huì)附帶在網(wǎng)頁(yè)瀏覽器之中。下面我們來(lái)詳細(xì)了解一下吧2019-06-06