前端構建工具滿天飛的情景下，筆者也忍不住去搗鼓了一下，真正體驗一下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前端構建工具版本號管理方案思考
前端構建工具滿天飛的情景下，筆者也忍不住去搗鼓了一下，真正體驗一下nodejs帶來的魅力，經過一段時間規劃設計，終於將平台工具搗鼓出來了。在裡面也體驗了express,socket.io,grunt等node外掛程式服務，使用很流暢，並且很好的完了我的基本需求 js css image的壓縮和自動部...
前端構建工具
一 什麼是 自動化 構建工具 構建工具是一種自動化工具。一般專案都有較多的檔案，為開發維護方便拆分單個的模組,在發布的時候,對拆分後的各模組進行合併,壓縮等，構建工具可以幫完成這些重複的工作。二 什麼是包管理工具 可以安裝 解除安裝 更新 檢視 搜尋 發布等功能。類似grunt，gulp構建工具，和...
前端構建工具
devdependencies gulp強調的是前端開發的工作流程，側重於前端開發的整個過程的控制管理 像是流水線 我們可以通過配置一系列的task，定義task處理的事務 例如檔案壓縮合併 雪碧圖 啟動server 版本控制等 然後定義執行順序，來讓gulp執行這些task，從而構建專案的整個前端...