[TOC] ## 前言 本文主要是針對開發、測試、生產環境的差別配置中，下面分拆一些細節的點，是對應到不同環境所對應的差別配置。 ## 接口請求方式 開發環境主要是利用proxyTable進行跨域的請求，而測試或者線上則是打包的時候通過配置文件的不同，導致請求到不同的域名地址 （直接跨域請求）。 **備注** ：這里也會因為部署策略的不同，導致解決跨域的方式不同，如果是資源部署到cdn，那么就會涉及到只能跨域請求； 而如果是部署到nginx服務器，則可以通過服務器配置進行接口的轉發而不是直接請求，這里區別的就是如果使用nginx服務器，可以設置一些業務轉發規則，這里的配置要分清楚是否有必要。 ## 資源部署目錄 不同環境的部署服務器和目錄是不一致的，webpack本地開發運行的時候是沒有部署的靜態資源的，而其他環境是有對應的服務器的，而不同環境可能是不同服務器，或者僅僅是不同的目錄。 冗余資源的考慮： 目前的資源是全量增加的，沒有做的部分 ： 1 資源增量更新沒做 2 過期資源沒考慮 3 資源的回退方案是做備份還是根據歷史分支重新部署 ## 開發調試方式 webpack自帶了熱更新功能，可以實現代碼的本地同步顯示到瀏覽器，這是一方面。而線上環境的區分就是我們很多調試、邏輯部分是區分不了的，有些業務問題是無法重現的。 那么詳細看下開發環境以及線上環境的方案有什么區別： ### 開發環境 斷點調試，可以調試看到基本的業務邏輯以及報錯信息，減少console.log的報文信息。 開發環境可以看到對應的開發源文件，而非打包后的信息，定位不到源文件。 開發環境可以找到不同的情況測試數據，可反復測試，可以去掉中間某個環節的繼續，驗證邏輯的嚴謹性。 ### 測試環境 不能很好的調試，目前沒有配置對應的測試工具，沒有設置攔截的工具。 可以提供不同情況的測試數據進行反復測試。 ### 生產環境 不能調試； 數據不能進行反復調試。 ## 壓縮機制 ### 測試與生產環境的壓縮 這里主要是涉及到項目部署之后的打包，測試與生產環境的壓縮機制是一致的。那么這里簡單列下可能需要做的： - 樣式單獨打包與拆分，壓縮，兼容的處理 - js的壓縮 - 代碼分割 - 壓縮水平的詳細配置 - 增量更新 - 公共文件的更新 - 兼容配置，babel的配置水準，異步編程的支持