一、工程說明:
1.代碼git倉庫地址:git@gitlab.*****.git。
2.目錄結構:
1>.index.html 為build打包發布網頁入口;
2>.lieda文件夾代碼項目工程目錄;
3>.static為build打包發布網頁入口訪問資源;
注意:不是發布勿動index.html和static文件,勿在該層級目錄下引入任何資源
3.開發打開leida項目工程進行開發。
4.git中test分支為測試環境;master為線上環境分支;
二、工程注意事項:
1.拉下分支更新資源文件:cnpm install
2.接入第三方庫(在package.json—>dependencies中添加可省去此步驟):
1>.Mint-ui H5開發快速集成組建;
2>.base64-js-codec加密;
3>.fastclick雙擊事件(地址:http://www.cnblogs.com/yexiaochai/p/3442220.html);
4>.font-awesome一套絕佳的圖標字體庫和css框架;
5>.js-cookie緩存;
6>. Lodash封裝了諸多對字符串、數組、對象等常見數據類型的處理函數;
7>.normalize.css讓所有的瀏覽器上對於未定義的樣式瀏覽效果達到一致;
8>.promise異步操作,有三種狀態:Pending(進行中)、Resolved(已完成,又稱 Fulfilled)和 Rejected(已失敗);
9>.store.js輕松實現本地緩存(地址:http://www.cnblogs.com/lhb25/p/store-js-for-localstorage.html);
10>.vue-router路由跳轉;
11>.animate.css動畫;
12>.vue;
三、工程目錄結構:
1.src問開發中文件目錄,
下:
apis文件夾(所有的網絡請求文件)
—>根據不同需求功能建立不同的文件夾例如:advert文件夾;
—>utils文件夾網絡底層請求封裝;
assets文件夾:放圖片資源,
—>下根據不同的頁面新建不同的文件夾再放入資源圖片;
components文件夾:公用封裝組建,
—>根據功能划分新建功能文件夾然后新建組建;
filters文件夾:處理業務顯示js文件,例如(處理職位類型,公司規模,時間顯示的js文件):
export let genderRequired = function(id){
if(id==0){
return "不限"
}else if(id==1){
return "男士優先"
}else if(id==2){
return "女士優先"
}else{
return "";
}
}
routers:路由配置文件;
views:頁面代碼文件
—>根據不同的業務建立文件夾!
styles:不同的css樣式封裝;
四、打包發布流程;
1.測試域名為:lie*****.com 對應的分支為test;
2.線上域名為:暫時沒配置 對應的分支為master;
3.npm run build 等待生成dist文件(dist文件為打包之后的文件資源包);
4.替換一級目錄下的index.html文件和static文件夾;
5.上傳打包后代碼到git上test分支;
6.進入ci.*****.com網頁發布 —>前端發布(測試環境)—>***.h5項目—>立即構建