vue全家桶項目搭建（vue-cli 2.9.6+vue-router+vuex+axios）

1、安裝vue-cli + vue-router + vuex + axios

　　一、安裝vue-cli

　　　　

　　二、建立項目

　　　　

　　三、安裝vuex和axios

　　　　

2、搭建項目目錄結構，以下所示：

　　

 

　　一、assets目錄用於存放靜態文件，如圖片等等。

　　二、components目錄用於存放一些封裝的公用的組件。

　　三、config目錄用於存放配置項信息。

　　四、page目錄用於存放頁面組件。

　　五、router目錄用於存放路由信息。

　　六、service目錄用於存放請求後臺接口的操做。api.js用於封裝統一請求接口。

　　七、store目錄用於存放vuex的相關信息。

3、配置vuex

　　在/src/store/index.js中，寫入以下內容

　　　　

 

　　在main.js中引入store：

　　　

4、項目結構就此搭建完成，控制檯中輸入npm run dev可查看到以下頁面：