WebP 解決方案

啟用webp:

1. 開啟 .tmtworkflowrc, 開啟設定：

{  "supportWebp": true}

2. 執行 gulp build_dist 即可

webp 的實作流程

1. #將sprite 和img 目錄下的圖片轉換成.webp 格式
2. #將轉換後的.webp 檔案和原始檔案作比較，找出最小檔案(有些轉換後比原始檔案大)
3. #產生.webp.css 文件，裡面呼叫的都是最小檔案
4. 將html 引用的css 位址緩存，並插入webp 相關的JS，瀏覽器載入的時候，這段JS 會預先判斷瀏覽器是否支援webp，是的話再將css 位址切換成對應的.css 或.webp .css

此為webp 在前端應用中的常見解決方案，個人可以根據實際情況進行相應調整。