前端構(gòu)建工具滿天飛的情景下，筆者也忍不住去搗鼓了一下，真正體驗一下NODEJS帶來的魅力，經(jīng)過一段時間規(guī)劃設(shè)計，終于將平臺工具搗鼓出來了。在里面也體驗了express, socket.io, grunt等node插件服務(wù)，使用很流暢，并且很好的完了我的基本需求(JS\CSS\IMAGE的壓縮和自動部署功能)。

　　雖然基本功能完成，但是還有一個讓人容易忽略而又重要的問題來了，就是資源文件的版本號的問題。在這里用的是SeaJS來做的模塊管理，也在網(wǎng)上搜集了一下關(guān)于這塊的資料。大致有以下兩種方案：

　　1、配置SeaJS的map對象。很方便，集中管理，但是也存在一些問題，比如：map對象的維護、配置文件引用頁面的時間戳問題。

　　2、生成文件sign，替換原有文件的名。這里不用考慮頁面引用的時間戳問題，但是需要對資源及頁面做一次全文查找替換，這對于分散部署的情況下將會非常復(fù)雜。

　　看了上面兩種方案后，感覺在我的場景下還存在一些不足之處。筆者想要的是不影響開發(fā)情況下，開發(fā)人員完全不用考慮文件被緩存問題，只需完成編碼，提交到構(gòu)建系統(tǒng)后，一鍵完成構(gòu)建和部署。

　　確定好目標后，既然不想讓開發(fā)同學(xué)關(guān)心時間戳問題，那么是否可以將這個工作交給Web服務(wù)器來做呢?那么交給服務(wù)器來做之后，如何動態(tài)的更新最新的資源文件呢?

　　有問題就好解決，將問題拋出來之后，方案也漸進呈現(xiàn)出來，不啰嗦了，直接上筆者的實現(xiàn)方案：

　　構(gòu)建工具動態(tài)生成.htaccess文件，將構(gòu)建的資源文件的URL重寫列表同步到.htaccess文件中以達到由服務(wù)器動態(tài)獲取新的資源文件。

　　(備注：筆者是在apache環(huán)境下，對IIS\NGINX\TOMCAT\RESIN\JBOSS等環(huán)境還需要再研究研究。)

　　看了上面的方案是不是很簡單，那具體是怎么做的呢?筆者也在這里列一下。

　　1. 構(gòu)建工具在構(gòu)的時候生成一個與filename.ext對應(yīng)的filename.ext.sha1的文件，這個.sha1的文件存放filename.ext文件的sha1值。

　　2. 在構(gòu)建完成后，構(gòu)建工具讀取.htaccess的模板，并且遍歷得到所有資源文件的列表，生成一個對filename.ext對應(yīng)的filename.ext.sign的文件。

　　3. 按規(guī)則生成RewriteCond和RewriteRule。并將規(guī)則數(shù)據(jù)寫到.htaccess文件中并部署到資源文件站點的根據(jù)目錄。

　　圖一：構(gòu)建工具基本結(jié)構(gòu)圖

　　圖二：構(gòu)建后的文件列表

　　圖三：生成一條Rule

　　圖四：生成后的.htaccess文件

　　OK，到這里基本告一段落了，資源版本號解決了。但是對于性能影響這塊還需要觀察，待有時間再研究。

新聞標題：Web前端構(gòu)建工具版本號管理方案思考
地址分享：http://chinadenli.net/news5/170255.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供響應(yīng)式網(wǎng)站、微信小程序、動態(tài)網(wǎng)站、云服務(wù)器、標簽優(yōu)化、網(wǎng)站營銷

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)