docker+react+nginx部署

一、准备工作

  1、先确保项目可以正常运行。

  2、如果拉代码到Linux下进行打包,注意node版本,我就是版本不同,yarn build一直不成功。

  3、找一个nginx的配置文件nginx.conf,放在项目根目录。

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

    gzip on;
    gzip_min_length 1k;
    gzip_comp_level 9;
    gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml;
    gzip_vary on;
    gzip_disable "MSIE [1-6]\.";

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


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

    # 后台服务器地址,你自己的后端服务ip地址
    location /api/ {
        proxy_pass http://0.0.0.0:8080;
    }
}

  4、打包项目 yarn build

二、编写Dockerfile文件,生成镜像

FROM nginx
COPY ./build /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

  docker build -t test:v1.0.0 .    # 注意最后的那个“.”,说明是当前目录下

三、运行镜像及调试

  docker run -it --name test -p 8080:8080 test:v1.0.0

  一开始不建议-d直接后台运行,这样报错的话不利于调试,确保没有问题后再进行后台

posted @ 2023-03-02 14:49  飞羽小鱼仔  阅读(309)  评论(0编辑  收藏  举报