一、准备工作

  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直接后台运行,这样报错的话不利于调试,确保没有问题后再进行后台

docker+react+nginx部署的更多相关文章

  1. ASP.NET Core Docker jexus nginx部署-CentOS实践版

    本文用图文的方式记录了我自己搭建centos+asp.net core + docker + jexus + nginx的整个过程,希望对有同样需求的朋友有一定的参考作用. 本文主要内容如下: cen ...

  2. Docker镜像+nginx 部署 vue 项目

    一.打包vue项目 在开发完的vue项目输入如下命名,打包生成dist文件夹 yarn build / npm run build 此时根目录会多出一个文件夹:dist文件夹,里面就是我们要发布的东西 ...

  3. docker 用nginx 部署 node应用

    1.查询镜像 # 1.查询镜像. docker search nginx  2.拉取指定的镜像 # 2.拉取指定的镜像 docker pull nginx 3.下载完成后终端查看 # 3.下载完成后终 ...

  4. CentOS7上Docker简单安装及nginx部署

    安装 如果原来安装过docker,先把原来的删掉,再安装(如果是首次安装docker忽略第一步,直接在第二步看起) 1.1先查看下已经安装了那些docker yum list installed | ...

  5. Docker Compose 一键部署Nginx代理Tomcat集群

    Docker Compose 一键部署Nginx代理Tomcat集群 目录结构 [root@localhost ~]# tree compose_nginx_tomcat/ compose_nginx ...

  6. 从docker到docker-compose部署一个nginx+flask+mysql+redis应用

    目的是把一个flask项目的mysql数据库.redis数据库.flask应用.nginx服务分别装到四个容器中,然后用docker-compose命令同时启动与关闭 一.安装docker Docke ...

  7. Docker 基本操作(附 redis、nginx部署)

    下载安装 Docker 也有一个月了.中间看过几次也没有深入的了解研究.就只是拉取了两个镜像简单的看了看. 昨天因一个项目中需要用到 Redis ,因为是 Windows 系统,看了下安装包比较老了有 ...

  8. mysql|tomcat|nginx|redis在docker中的部署

    MySQL部署 拉取MySQL镜像 docker pull mysql 查看镜像 创建MySQL容器 docker run -di --name pinyougou_mysql -p 33306:33 ...

  9. Linux下自动化部署ASP.NET CORE 3.1(Docker+Jenkins+Nginx)

    1.先配置好Docker阿里云加速,可以使用阿里云容器服务 (可自己在阿里云申请,要不然安装东西直接很慢)注意:https://XXXX.mirror.aliyuncs.com为阿里云加速服务分配地址 ...

  10. Docker 学习之部署php + nginx(一)

    博主电脑系统是window 10 专业版的,所以在此记录下docker的基本使用方法. 参考地址: https://www.runoob.com/docker/docker-install-php.h ...

随机推荐

  1. vue3 ts遇到的问题

    main.ts中的 createApp(App),只作用于一个,如果,有两个,则并不是一个对象,另一个会不生效

  2. java_web案例文件下载案例

    目的:完成javaweb的文件下载 <!--如果想要一个a标签点击后不论文件类型,都需要弹出下载,保存框:--><!--我们就需要创建一个servlet,让这个a标签指向servle ...

  3. HashSet()相关易错点

    package homework_;import java.util.HashSet;import java.util.Objects;/* * @author YAM */public class ...

  4. 【Gerald and Giant Chess】

    一道计数类DP例题~~~ ps:P党似乎不多了-- 我这只蒟蒻第一次写题解,而且计数类DP还是早上刚学的,现学现用,或者说是所谓的"浅谈"一番吧!况且这题写题解的人似乎并不多(大佬 ...

  5. JZOJ 5350. 【NOIP2017提高A组模拟9.7】陶陶摘苹果

    题目 分析 很神奇的事情又发生了!! 很容易想到设 \(f_{i,j}\) 表示考虑前 \(i\) 个区间,已选 \(j\) 个区间且必选第 \(i\) 时能覆盖到的最多苹果数 转移 \(O(n)\) ...

  6. Spring Boot学习笔记(一)----概要与入门

    本文来自博客园,作者:{张果},转载请注明原文链接:{SpringBoot学习笔记(一)--SpringBoot概要与快速入门} 一.Spring Boot概要 没有Spring Boot开发项目时各 ...

  7. MySQL数据类型补充

    数据类型 整数数据类型 特殊说明: ​ 对于整数类型,MySQL还支持在类型名称后面加小括号(M),而小括号中的M表示显示宽度,M的取值范围是(0, 255).int(M)这个M在字段的属性中指定了u ...

  8. postgresql索引使用情况及坏索引处理

    1.postgresql中索引系统视图pg_stat_user_indexes TEST=# \d+ sys_stat_user_indexes View "SYS_CATALOG.sys_ ...

  9. Vue 组件VueComponent中_ _proto_ _ 原型对象的指向(指向Vue的原型对象 _ _proto_ _)

    1.VueComponent.prototype.__proto__ === Vue.prototype 2.让组件实例对象(vc)可以访问到Vue原型上的属性.方法 图片如下: 案例: Vue.pr ...

  10. appsettings.json用机密替换字符串-利用 VisualStudio 管理用户机密

    以纯文本形式存储密码是不安全的. 例如,存储在中的数据库连接字符串 appsettings.json 可能包含指定用户的 密码: { "ConnectionStrings": { ...