記錄一次vue-cli工程打包部署過程

1、打包，執行package.json檔案中build對應命令：npm run build:prod

 2、下載nginx,將前端部署到nginx中（我使用的是windows環境）

1）、http://nginx.org/en/download.html 下載nginx檔案到本地

 2）安裝部署：

a、下載完成後，解壓，執行cmd,不要直接就雙擊nginx.exe

b、cd到解壓之後的目錄（到直接能看到docs,conf等的目錄）

c、啟動：start nginx

d、預設埠號是80，訪問localhost:80看是否能訪問到nginx的首頁，能訪問到，啟動成功，沒有則啟動失敗

訪問失敗：檢視logs資料夾下error.log檔案；常見錯誤：埠號被佔用，nginx資料夾路徑含中文

3、部署前端專案到nginx中

1）開啟conf/nginx.conf檔案，修改root 為前端專案打包後的目錄，儲存

2） 修改完成後，使用下面命令校驗配置檔案是否正確 test is successful就表明正確了

nginx -t -c conf/nginx.conf

3）nginx -s reload 重新啟動nginx檔案，訪問localhost:8800就可以看到前端專案了

4）若需要代理到後臺介面，增加location配置，nginx -s reload重新啟動，訪問

 4、至此，部署完成

5、關閉nginx命令

nginx -s quit