react docker

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

root /usr/share/nginx/html;
index index.html index.htm;

location / {
    try_files $uri $uri/ /index.html;
}

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

}

docker build -t my-react-app .
docker run -p 80:80 my-react-app

# 使用官方的Node镜像作为基础镜像
FROM node:18.20.4-alpine as build-stage

# 设置工作目录
WORKDIR /app

# 复制 package.json 和 yarn.lock
COPY package.json yarn.lock ./

# 安装依赖
RUN yarn install --frozen-lockfile

# 复制项目文件
COPY . .

# 构建 React 应用
RUN yarn build

# 使用 Nginx 作为服务器,部署应用
FROM nginx:alpine

# 将构建好的React应用静态文件复制到Nginx的默认HTML目录
COPY --from=build-stage /app/build /usr/share/nginx/html

# 将自定义的Nginx配置文件复制到Nginx的配置目录
COPY nginx.conf /etc/nginx/conf.d/default.conf

# 暴露80端口
EXPOSE 80

# 启动Nginx
CMD ["nginx", "-g", "daemon off;"]

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值