1.安裝node.js
從node.js官網(wǎng)下載并安裝node，安裝步驟很簡單，只要一路next可以了。
安裝完成后，打開命令行工具(win+r,然后輸入cmd)輸入命令node -v，如下圖，如果出現(xiàn)對應版本號，就說明安裝成功了。
我們所需要的npm包管理器，是集成在node中的，所以，直接輸入npm -v就會如下圖所示，顯示出npm的版本信息。
這里需要說明下，因為在官網(wǎng)下載安裝node.js后，就已經(jīng)自帶npm（包管理工具）了，另需要注意的是npm的版本最好是3.x.x以上，以免對后續(xù)產(chǎn)生影響。
到這里node的環(huán)境已經(jīng)安裝完了,npm包管理工具也有了，但是由于npm的有些資源被墻，有時候安裝依賴會很慢，為了更快更穩(wěn)定,所以我們需要切換到淘寶的npm鏡像——cnpm。
這里需要說明下，不安裝不影響項目可跳過后面用到的cnpm換成npm即可
2.安裝cnpm
點擊進入淘寶的cnpm淘寶鏡像網(wǎng)站,里面有詳細的配置方法。
或者直接在命令行輸入：
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
然后等待，安裝完成。輸入cnpm -v，可以查看當前cnpm版本，這個和npm的版本還是不一樣的。
使用cnpm的方法就是，需要用到npm的地方直接使用cnpm替換就可以了（反之即可）
3. 安裝webpack
安裝webpack，打開命令行工具輸入：
npm install webpack -g
安裝完成之后輸入 webpack -v，如下圖，如果出現(xiàn)相應的版本號，則說明安裝成功。
4. 安裝vue-cli腳手架構(gòu)建工具
打開命令行工具輸入：
npm install vue-cli -g
安裝完成之后輸入 vue -V（注意這里是大寫的“V”），如下圖，如果出現(xiàn)相應的版本號，則說明安裝成功。
通過以上四步，我們需要準備的環(huán)境和工具都準備好了，接下來就開始使用vue-cli來構(gòu)建項目（如果你是最近安裝的vue cli 3那就把下面的
vue init webpack my-project換成vue create my-project即可）
創(chuàng)建一個基于 webpack 模板新項目
要創(chuàng)建項目，首先我們要選定目錄，然后在文件夾頂部地址欄輸入cmd打開命令行開始初始化一個項目：
vue init webpack my-project
或使用：
vue init webpack-simple my-project
注意：my-project為自定義項目名，項目名不能使用中文，項目名不能大寫
說明：也可以在目錄下新建一個文件夾在該文件夾下輸入命令 vue init webpack 這樣可以不使用命令新建項目。二選一
創(chuàng)建項目步驟解析:
vue init webpack my-project----------------------------- 這個是那個安裝vue腳手架的命令? Project name <my-project>--------------------------------項目名稱（不寫為空）
? Project description <A Vue.js project>-------------------項目描述（不寫為空）
? Author------------------------------------------------------------項目創(chuàng)建者（不寫為空）回車
? Install vue-router? <Y/n>------------------------------------是否安裝Vue路由（y代表是/n代表否）自行選擇
? Use ESLint to lint your code? <Y/n>---------------------是否啟用eslint檢測規(guī)則，這里個人建議選no
? Set up unit tests <Y/n>--------------------------------------是否設置單元測試，個人建議no
? Setup e2e tests with Nightwatch <Y/n>-----------------是否端到端測試，個人建議no然后一直回車，項目開始拉取創(chuàng)建---項目創(chuàng)建成功
創(chuàng)建完成的my-project目錄如下：
下面我簡單的說明下各個目錄都是干嘛的：
5.啟動my-project項目，在項目命令行中輸入：
npm run dev
運行成功后會出現(xiàn)：
Your application is running here:http://localhost:8080
注意：后面8080為端口號不固定，當8080端口號被占用時會自動選擇其他端口
瀏覽器輸入localhost:8080會默認打開一個“歡迎頁面”，如下圖：
附：
1. npm 開啟了npm run dev以后怎么退出或關閉？
ctrl+c
2. --save-dev
自動把模塊和版本號添加到模塊配置文件package.json中的依賴里devdependencies部分
3. --save 與 --save-dev的區(qū)別
--save :安裝包信息將加入到dependencies（生產(chǎn)階段的依賴）
--save-dev :安裝包信息將加入到devDependencies（開發(fā)階段的依賴），所以開發(fā)階段一般使用它