webpack是現在較流行的前端自動化工具，該工具可以幫助開發者打包程式碼，以減少需要手動的工作，可以提高開發效率。

vue中提供了一個腳手架工具vue-cli，這個工具已經將webpack配置好了，使用這個工具可以快速地搭建一個標準專案。

一、安裝node

1.在 https://nodejs.org/zh-cn/   去下載，根據你的機型來選擇。

2.檢查node是否安裝成功

mac：在終端輸入 node -v

windows：開啟命令列工具，輸入 node -v

出現版本號則安裝成功

3.檢視npm是否安裝成功

mac：終端輸入 npm -v

windows：開啟命令列工具，輸入npm -v

出現版本號則安裝成功

windows系統下安裝成功

 二、全域性安裝vue vue-cli

1.使用命令安裝

mac：

sudo npm install vue @vue-cli -g

windows：

npm install vue @vue-cli -g

安裝時遇到問題可以參考：

https://blog.csdn.net/gebitan505/article/details/48177405

2.檢視vue是否安裝成功

vue -V

三、初始化一個vue專案

1.使用命令列

vue create 專案名（你自己定義的，並且一定要記得安裝的路徑）。

 2.之後會讓你先擇預設，作為初學者我們暫選第一項：default選項。接下來就是安裝過程。

會把各種依賴，以及vue的框架結構都幫我們搭建好。安裝好後，你會看到裡面多了很檔案以及資料夾。

四、檢視vue專案是否搭建成功

 1.使用命令列進入之前建立的專案

cd 專案名（初始化的時候定義的專案名稱）

2.啟動服務

npm run serve

這個命令會開啟一個localhost, 複製這個 localhost地址到瀏覽器，回車開啟，會看到一個vue歡迎介面。

如果能夠正常開啟，說明搭建成功！

原文連結：https://mp.weixin.qq.com/s/n9T6M2Md0UirnQWcmP_8Zg