一篇文章帶你瞭解網頁框架——Vue簡單入門 這篇文章將會介紹我們前端入門級別的框架——Vue的簡單使用 如果你以後想從事後端程式員，又想要稍微瞭解前端框架知識，那麼這篇文章或許可以給你帶來幫助 溫馨提醒：在學習該文章前，請先學習HTML，CSS，JavaScript，Ajax等前端知識 Vue基礎 ...
Vue項目打包成docker鏡像部署
一、介紹
我們部署Vue項目，可以build之後，直接放到nginx下麵即可，今天給大家介紹創建docker鏡像，使用docker鏡像啟動容器運行部署Vue項目的方式，可以嘗試嘗試，原理和使用nginx部署一樣，不過是使用的docker容器而已，內部還是使用的是nginx作為基礎鏡像。
二、docker安裝
docker安裝就不介紹了，不懂的伙伴可以去看我的docker安裝文章。之前也寫過關於docker介紹、安裝的文章，不瞭解如何安裝使用的可以看以往的文章。
三、編寫DockerFile
docker安裝完成之後，在我們需要部署的項目目錄中新建文件dockerFile。文件內容如下：
FROM nginx:latest
LABEL Author xpy
COPY build /usr/share/nginx/html
第一行：設置基礎鏡像，基礎鏡像使用nginx
第二行：作者信息
第三行：將build文件夾下麵的內容拷貝到/usr/share/nginx/html目錄下麵（nginx的預設項目路徑），其中build文件夾有可能是dist文件夾，如果沒有，重新npm run build一下就出來了,也就是我們Vue項目打包之後我們正常使用nginx是拷貝過去的文件夾。
四、創建鏡像
docker build -t xxx .
註意：後面的.不能省略，鏡像創建成功之後使用docker images即可看到自己創建的鏡像
五、啟動鏡像
docker run -d --name xxx -p 8888:80 xxx
啟動命令說明：
-d：容器後臺啟動
—name : 容器名稱
-p 8888:80 ：將nginx容器的80埠映射到主機的8888埠，我們訪問時直接訪問主機ip+映射到主機的埠，這裡是8888，如果有路徑，後面還要帶上路徑。
xxx : 我們剛剛創建的自己的鏡像的名稱
六、總結
以上步驟即可幫助我們使用docker容器部署Vue項目，原理其實和我們使用nginx部署Vue是一樣的，我們打包自己的鏡像使用的基礎鏡像也是nginx，感興趣的小伙伴可以自己動手嘗試嘗試。
原文鏈接:https://monkey.blog.xpyvip.top/archives/vue-xiang-mu-da-bao-cheng-docker-jing-xiang-bu-shu
