Web前端構建工具版本號管理方案思考

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

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

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

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

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

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

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

　　構建工具動態生成.htaccess文件，將構建的資源文件的URL重寫列表同步到.htaccess文件中以達到由服務器動態獲取新的資源文件。

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

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

　　1. 構建工具在構的時候生成一個與filename.ext對應的filename.ext.sha1的文件，這個.sha1的文件存放filename.ext文件的sha1值。

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

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

　　圖一：構建工具基本結構圖

　　圖二：構建后的文件列表

　　圖三：生成一條Rule

　　圖四：生成后的.htaccess文件

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

新聞標題：Web前端構建工具版本號管理方案思考
地址分享：http://m.kartarina.com/news5/170255.html

成都網站建設公司_創新互聯，為您提供響應式網站、微信小程序、動態網站、云服務器、標簽優化、網站營銷

廣告

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