建立第乙個vue專案

1，配置node環境

2，開啟cmd切換到node安裝目錄，安裝vue-cli:vue-cli會自動按照專案結構在你本地初始化乙個專案，當然不用該工具，手動建資料夾配置js等也可以的，但是vue-cli 一行命令就自動生成了多方便呢

npm install vue-cli -g

3，切換到工作目錄，在該目錄下使用vue-cli初始化乙個專案

vue init webpack projecttest  #自定義的專案名

4，使用node.js部署測試執行

cd projecttest npm install npm run dev

5,執行這個**

6，打包發布

1）用cmd並進入到vue專案，或者在vue專案shift+右鍵開啟powershell視窗，輸入命令

npm run build

7,dev和build的區別

當我們執行npm build和npm dev其實都是執行的script裡面的內容

package.json裡面

"dev": "node build/dev-server.js",

"build": "node build/build.js",

解釋：執行」npm run dev」的時候執行的是build/dev-server.js檔案，

執行」npm run build」的時候執行的是build/build.js檔案。

檢查node和npm的版本

引入相關外掛程式和配置

建立express伺服器和webpack編譯器

配置開發中介軟體（webpack-dev-middleware）和熱過載中介軟體（webpack-hot-middleware）

掛載**服務和中介軟體

配置靜態資源

啟動伺服器監聽特定埠（8080）

自動開啟瀏覽器並開啟特定**（localhost:8080）

說明： express伺服器提供靜態檔案服務，不過它還使用了http-proxy-middleware，乙個http請求**的中介軟體。前端開發過程中需要使用到後台的api的話，可以通過配置proxytable來將相應的後台請求**到專用的api伺服器。

構建環境下的配置，

build.js主要完成下面幾件事：

loading動畫

刪除建立目標資料夾

webpack編譯

輸出資訊

注：在我的理解，第乙個是開發環境本地除錯用的，第二個是專案生產環境用的，專案打包後**壓縮更安全