安装Docker

确保系统中已安装Docker。

对于Ubuntu/Debian系统，可通过以下命令安装：

sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io

对于CentOS/麒麟系统，可通过以下命令安装：

sudo yum -y install docker

验证安装是否成功：

docker --version

拉取Nginx镜像

从Docker Hub拉取官方Nginx镜像。默认拉取最新版本，如需指定版本（如1.29.2），添加标签即可：

docker pull nginx
# 或指定版本
docker pull nginx:1.29.2

创建Dockerfile

如需构造镜像需要dockerfile，否则可不用。不使用dockerfile则需要手动逐个处理

FROM nginx:latest

# 删除默认配置文件
RUN rm /etc/nginx/conf.d/default.conf

# 复制自定义Nginx配置
COPY nginx.conf /etc/nginx/conf.d/

# 复制前端构建产物
COPY dist/ /usr/share/nginx/html/

# 为静态文件授权
RUN chown -R nginx:nginx /usr/share/nginx/html

# 暴露80端口
EXPOSE 80

# 保持容器运行
CMD ["nginx", "-g", "daemon off;"]

创建nginx.conf

server {
    listen 80;
    server_name yourdomain.com;  # 你的域名或服务器 IP

    # 根目录指向 Vue 打包后的 dist 目录
    root /usr/share/nginx/html;
    # 如果前面还有文根如：http://127.0.0.1/webapp/index.html
    # index webapp/index.html;
    index index.html;  # 默认入口文件

    # 处理 Vue 路由（SPA 核心配置）
    location / {
        # 当请求的文件或目录不存在时，重定向到 index.html
        # 确保 Vue Router 的 history 模式能正常工作
        try_files $uri $uri/ /index.html;
    }

    # 处理静态资源（缓存优化）
    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        # 静态资源缓存 30 天（可根据需求调整）
        expires 30d;
        add_header Cache-Control "public, max-age=2592000";
    }

    # 禁止访问 .env 等敏感文件
    location ~ /\.(env|git|svn|ht) {
        deny all;
        return 403;
    }

    # 错误页面配置
    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
        root /usr/share/nginx/html;
    }

}

构建镜像

如需构造镜像需要dockerfile，否则可不用。不使用dockerfile则需要手动逐个处理

# (在Dockerfile所在目录执行)
# docker build -t 镜像名 .
docker build -t my-nginx .

创建容器并启动

# 运行容器（带目录挂载），其中my-nginx为dockerfile构造的新镜像，没有的直接用nginx
docker run -d --name nginx-app \
  -p 8080:80 \
  my-nginx

配置Nginx

（用构建镜像不需要操作）

# 复制宿主机上的nginx配置文件到容器中
docker cp nginx.conf my-ngixn:/etc/nginx/conf.d/nginx.conf

# 复制前端文件到容器中
docker cp dist/ /usr/share/nginx/html/

# 重启容器
docker restart nginx-app

验证方法：

# 检查容器状态
docker ps

# 查看实时日志
docker logs -f nginx-app

# 测试访问
curl http://localhost:8080

配置自定义参数

如需自定义配置文件，需将配置文件挂载到容器内，可不传到容器中。例如，创建本地配置文件nginx.conf并运行：

# 运行容器（带目录挂载），其中my-nginx为dockerfile构造的新镜像，没有的直接用nginx
docker run -d --name nginx-app \
  -p 8080:80 \
  -v $(pwd)/dist:/usr/share/nginx/html \
  -v $(pwd)/nginx.conf:/etc/nginx/conf.d/nginx.conf \
  nginx

停止与删除容器

停止运行中的容器：

docker stop nginx-app

删除容器（需先停止）：

docker rm nginx-app