Web前端構(gòu)建工具版本號(hào)管理方案思考

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

　　圖三：生成一條Rule

　　圖四：生成后的.htaccess文件

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

新聞標(biāo)題：Web前端構(gòu)建工具版本號(hào)管理方案思考
地址分享：http://www.bm7419.com/news5/170255.html

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

廣告

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