vue-cli + element-ui + webpack 新建項目

 

1.進入項目目錄

 

2.全局安裝vue-cli

輸入命令：npm install vue-cli -g

若報錯：ENOENT: no such file or directory, access......

進入vue-cli所在目錄，手動將vue-cli刪除，再從新安裝便可成功。

 

3.建立項目框架

輸入命令：vue init webpack exambank

 

依次按照提示輸入，項目名、項目描述、項目做者等等，

而後一路回車  看到最後這句項目就建立好了。

To get started:  就是告訴你接下來該作什麼，依次完成下面3行命令就能夠了。進入exambank項目-----運行項目

 

4.進入exambank目錄

輸入命令： cd exambank

 

5.安裝element-ui

element-ui官網：http://element.eleme.io/#/zh-CN/component/installation

輸入命令：npm i element-ui -S

或者：由於是基於Vue.js和elementUI進行的項目開發，因此固然要導入Vue.j包和elementUI包：npm install --save vue element-ui

 

 6.安裝vue-router

要進行頁面跳轉，因此要用到vue-router2：

輸入命令：npm install --save vue-router

 

7.安裝axios

要從後端獲取數據，因此要ajax請求，用vue官方推薦的axios：

輸入命令：npm install --save axios

 

8.根據須要，安裝vuex

輸入命令：npm install vuex --save

Vuex 是一個專爲 Vue.js 應用程序開發的狀態管理模式。它採用集中式存儲管理應用的全部組件的狀態，並以相應的規則保證狀態以一種可預測的方式發生變化。

雖然 Vuex 能夠幫助咱們管理共享狀態，但也附帶了更多的概念和框架。這須要對短時間和長期效益進行權衡。

若是您不打算開發大型單頁應用，使用 Vuex 多是繁瑣冗餘的。確實是如此——若是您的應用夠簡單，您最好不要使用 Vuex。一個簡單的 global event bus 就足夠您所需了。可是，若是您須要構建一箇中大型單頁應用，您極可能會考慮如何更好地在組件外部管理狀態，Vuex 將會成爲天然而然的選擇。

 

9.此後根據須要安裝其餘模塊

npm install xxxx --save