docker部署vue項目（基於Nginx）

1，獲取Nginx鏡像

docker pull nginx

2，創建Nginx文件夾存放conf,html,Dockerfile文件（我的目錄爲/root/nginx）

mkdir conf html

touch Dockerfile

3，將vue項目編譯，生成dist文件夾，將整個文件夾上傳到Nginx目錄下;如圖：

4，編寫Dockerfile文件

vi Dockerfile

添加一下內容：

FROM nginx

COPY dist/ /usr/share/nginx/html/

COPY conf/nginx.conf /etc/nginx/nginx.conf

命令的意思該鏡像是基於 nginx:latest 鏡像而構建的。

FROM nginx

命令的意思該鏡像是基於 nginx:latest 鏡像而構建的。

COPY dist/ /usr/share/nginx/html/

用本地的 nginx.conf 配置來替換nginx鏡像裏的默認配置。

COPY conf/nginx.conf /etc/nginx/nginx.conf

5，創建Nginx鏡像(注意後面的空格和點)

docker build -t nginx .

6，查看創建好的鏡像

docker images

7，運行並創建nginx容器

docker run -d -p 80:80 nginx

8，查看運行的容器

docker ps

然後從瀏覽器上訪問ip:80出現項目的首頁，部署成功

注意：一定要注意打包時ip的修改，本人踩過這坑

結束語：如那兒有不對的地方希望大佬指正，如對您有幫助，我就不白忙活。希望順手點個贊嘿嘿(*^▽^*)