軟件工程畢業(yè)的對需求很敏感，知曉做好一件事的需求工作十分重要，因此在這詳細列出本次工程化的需求。
背景
目前公司的web前端頁面是基于php框架之上，每次頁面代碼提交之后，由php同事進行數(shù)據(jù)處理及發(fā)布上線，十分不方便；由于前后端代碼放在一起，導致代碼管理混亂，協(xié)同開發(fā)效率低，代碼量過大；無測試、編譯、打包、壓縮、發(fā)布、版本迭代、調試等功能；
目的
1，前后端分離，代碼分開管理，分開提交，有效提升前后端協(xié)同開發(fā)效率；
2，前端使用目前流行的react，vue等MVVM框架，通過接口同域或跨域獲取后端提供的數(shù)據(jù)，數(shù)據(jù)統(tǒng)一處理后傳給組件，實現(xiàn)數(shù)據(jù)與視圖分離；組件化開發(fā)，在代碼復用、單元測試、場景切換等方面提高開發(fā)效率；
3，實現(xiàn)自動編譯、打包、壓縮、發(fā)布、版本迭代、線上調試、本地單元測試、模塊測試、項目測試、代碼校驗等功能；
4，配置路由，既能實現(xiàn)單頁spa項目路由功能，又能實現(xiàn)多頁項目的多個頁面的訪問，并且能夠提供同域接口。
需求點細分
1，前后分離，代碼分開
2，接口異步獲取后端數(shù)據(jù)
3，組件化開發(fā)，統(tǒng)一框架，配置環(huán)境
4，配置lint，進行代碼校驗，不合格的代碼無法通過編譯
5，配置單元測試（組件測試）環(huán)境，編寫demo，盡量清晰容易
6，配置路由，實現(xiàn)以下功能：1，單頁應用統(tǒng)一映射至本項目根目錄'/'，默認指向index.html頁面
2，多頁面應用可訪問真實路徑文件
3，默認可訪問所有文件，通過是否有后綴判斷，設置開關，可禁止訪問指定項目的文件
4，同域接口，'/api'開始統(tǒng)一為接口路徑，訪問本地的接口函數(shù)
5，其他功能，如訪問權限等
6，白名單， 無視規(guī)則限制
7，黑名單，無法訪問 ...
7，編譯，css（sass，less，postcss）js（jsx，es6，es7，harmony）html，json，img，react，vue，txt等
8，打包，組件化開發(fā)模式下，將頁面需要的組件引入，pack之后上線
9，壓縮，包括js，css，img的壓縮
10，發(fā)布，git代碼管理，發(fā)布到git倉庫，本地或者服務器進行構建
11，添加版本號，實時更新線上代碼
12，給線上壓縮文件生成對應source_map文件，便于線上調試
13，增量模式，只對更改的項目進行流程化操作
14，開關調試模式，內置遠程調試（手機端等）機制等形式，便于線上調試
15，接口域名根據(jù)環(huán)境匹配，設置global全局環(huán)境變量，線上環(huán)境使用線上域名，測試環(huán)境使用測試域名---（
根據(jù)當前url域名來判斷是在線上環(huán)境還是測試環(huán)境
）
16，生成雪碧圖，減少圖片請求
17，常用庫提取保存至根目錄library文件夾里，避免多項目重復庫文件
18，統(tǒng)一前端開發(fā)規(guī)范，編寫說明文檔
