一、項目目錄
這是一個web移動端項目，node+webpack+vue+mint-ui，目錄如下：
--build
--config
--node_modules
--src
--static
--test
.babelrc
.gitignore
index.html
karma.conf.js
package.json
README.md
build、config目錄下為一些環(huán)境配置，如webpack運行、打包配置等
node_modules目錄下為一些依賴包，通過npm install命令下載package.json里的依賴包
src目錄下是我們寫的頁面，具體的下面分析
test目錄下為前端自動化測試，與項目功能無關，可忽略
.babelrc文件：使用Babel的第一步，就是配置這個文件。Babel是一個廣泛使用的轉碼器，可以將ES6代碼轉為ES5代碼，從而在現有環(huán)境執(zhí)行。
.gitignore文件：每個Git項目中都需要一個“.gitignore”文件，這個文件的作用就是告訴Git哪些文件不需要添加到版本管理中。
index.html文件為項目主入口文件，該頁面實現了瀏覽器窗口寬度自適應
karma.conf.js文件為前端測試配置文件，與項目功能無關，可忽略
package.json文件：每個項目的根目錄下面，一般都有一個package.json文件，定義了這個項目所需要的各種模塊，以及項目的配置信息（比如名稱、版本、許可證等元數據）。npm install命令根據這個配置文件，自動下載所需的模塊，也就是配置項目所需的運行和開發(fā)環(huán)境。
二、src目錄詳解
--api
--assets
--filters
--pages
--router
--utils
--vuex
App.vue
main.js
api目錄下前端頁面調用接口的api設置，es6引入axios，axios 是一個基于Promise 用于瀏覽器和 nodejs 的 HTTP 客戶端，
importaxiosfrom'axios';
letbase=BASE_API;
//get post
exportconstajax=function(url,params,isPost) {
if(isPost) {
returnaxios.post(`${base}${url}`,params)
}
else{
returnaxios.post(`${base}${url}`+urlEncode1(params))
}
//處理get參數
functionurlEncode(param,key,encode) {
if(param==null)return'';
letparamStr='';
lett=typeof(param);
if(t=='string'||t=='number'||t=='boolean') {
paramStr+='&'+key+'='+((encode==null||encode)？encodeURIComponent(param):param);
}
else{
for(variinparam) {
vark=key==null?i:key+(paraminstanceofArray?'['+i+']':'.'+i);
paramStr+=urlEncode(param[i],k,encode);
}
}
returnparamStr;
}
functionurlEncode1(param,key,encode) {
if(param==null)return'';
letparamStr='';
for(letiinparam){
paramStr+='/'+param[i]
}
returnparamStr;
}
exportconstTradeCenter=params=>{returnajax('/trade/center',params,true) }
assets目錄下為一些公共樣式、圖片
filters目錄下為一些包含時間轉換方法的文件
pages目錄下為我們寫的頁面，我主要負責其中的UserCenter（個人中心）模塊
router目錄下為路由配置文件，頁面所有的跳轉路由配置都在該文件中
utils目錄下有兩個文件，一個為時間轉換成標準格式的函數文件，一個以網頁形式查看pdf格式文件
vuex目錄下是一個專為 Vue.js 應用程序開發(fā)的狀態(tài)管理模式。它采用集中式存儲管理應用的所有組件的狀態(tài)，并以相應的規(guī)則保證狀態(tài)以一種可預測的方式發(fā)生變化。包括以下3個文件：store，驅動應用的數據源；getters，以聲明方式將state映射到視圖；actions，響應在view上的用戶輸入導致的狀態(tài)變化。簡單點說就是全局的狀態(tài)管理，用戶在頁面觸發(fā)actions里面的方法從而調用store里的轉換特定狀態(tài)的方法，最后頁面通過getters里面的方法獲取已經改變的狀態(tài)。
App.vue文件為頁面組件總入口
main.js文件寫了一些配置，引入了Vue、App、router、store、commonFilters、Vuex等，引入后可以頁面中直接使用，不需重復引入，此外還定義了axios.interceptors攔截器
