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