vue-项目使用docker镜像进行集群部署

第一步：根目录创建default.conf文件

server {
    listen       80;
    listen  [::]:80;
    server_name  localhost;


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

    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # 处理404错误，重定向到index页面
    error_page 404 = @handle404;

    location @handle404 {
        rewrite ^ /index.html last;
    }
    
    # 其余配置保持不变
}

第二步：vue进行打包 打包后文件为dist
第三步：编辑Dockerfile文件

# 设置基础镜像
FROM nginx
# 定义作者
LABEL maintainer="wangpeijian"
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/ /usr/share/nginx/html/
# 替换默认配置文件
COPY default.conf /etc/nginx/conf.d/default.conf

最后：记得把容器80端口进行放通，default.conf文件可以根据自己实际情况进行修改