經過一段時間的代碼編寫，系統在本地已經可以運行，爲了讓其他組員以及演示時可用，現在需要部署。
在第一篇博客中驗證過使用docker部署Vue.js前端程序是沒有問題的，下面我開始進行打包部署。
docker打包部署嘗試
前提條件：centos中裝好了docker，並且pull了一個nginx鏡像，關於安裝可以去看第一篇博客。
1、在vue工程目錄下，npm run build，會生成一個dist目錄
2、在vue工程目錄下編寫Dockerfile，內容如下：
FROM nginx:latest
MAINTAINER [email protected]
COPY dist/ /usr/share/nginx/html/
3、生成自定義鏡像：docker build -t testImage . （注意這裏有個點）
4、生成容器：docker run -d --name testCon -p 8081:80 testImage
-p是將容器內部nginx的80端口轉發到本機的8081端口
然後就可以訪問本機localhost:8081，但是這個時候令人崩潰的來了，有些樣式沒有生效，如下圖所示：
可以看見此時下方滾動條全出來了，並且右側表格的展開項恢復爲了原格式中的白色，通過F12查看頁面元素髮現自定義的都沒有生效，然後查閱了很多資料都沒有解決；另外像自己後端的網絡請求是正常的，但像第三方（百度API——用來查閱IP所處省份）這個訪問不到，因爲這裏我用到了反向代理，具體可去第八篇博客查看。但是在前端vue配置的反向代理到了部署階段就無法生效，需要使用nginx的反向代理，但是經過查閱各種資料，修改例如nginx.conf，nginx服務重啓，都沒辦法生效，所以用docker部署的時候坑特別多，查閱資料還可以用GitHub、gitlab等提供的pages服務來部署，不過這些問題也會遇到。
遷移運行
既然部署vue部署不上，那也得讓組員們能夠運行，這裏就說一下拿到外部的vue工程文件如何可以在本機運行
1、首先具備vue的開發環境（node.js）；
2、將項目中的node_modules文件夾刪掉；
在文件夾下進行：
3、npm cache clean --force
4、cnpm cache clean --force，如果沒有用cnpm的話這步可忽略，如果沒有cnpm的話（npm install -g cnpm --registry=https://registry.npm.taobao.org）
5、cnpm install
6、npm run dev應該就能正常運行起來
此時組員們可以通過訪問本機8080端口就可成功運行。