首先建立一個nginx配置檔案，這個檔案後面會替換nginx映象中的配置檔案

default.conf

server {
    listen       80;
    server_name  localhost; 

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }

    error_page   500 502 503 504  /50x.html;
    location 
 
= /50x.html {
        root   html;
    }
}

建立Dockerfile檔案

FROM nginx

MAINTAINER “作者/維護者姓名”

RUN rm /etc/nginx/conf.d/default.conf

ADD default.conf /etc/nginx/conf.d/

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

如果用docker-compose啟動的話，

docker-compose.yml

services:
  vue:
    build:
      context: .  #Dockerfile 所在目錄
      dockerfile: Dockerfile 
    
 
image: vue  #映象名稱
   # restart: unless-stopped
   # network_mode: "host"
    privileged: true
    container_name: vue
    volumes:
      - /logs:/logs
    ports:
      - 8080:80

上面這個可以根據自己的來 ，我上面是映射了8080端口出來，所以訪問是localhost:8080，docker內部之所以是80 ,是因為我們上面的nginx配置檔案我們監聽的是80埠

目錄結構為

最後執行

docker-compose build
docker
 
-compose up -d

啟動成功後，訪問 localhost:8080（這個是伺服器內部訪問，外部需要自己修改ip地址）