当前位置：首页 > React

react服务如何部署

2026-03-31 04:07:23React

部署 React 服务的常见方法

使用静态文件托管服务

React 应用通常通过 npm run build 生成静态文件，可直接部署到托管服务。

Vercel：支持自动从 GitHub 部署，配置简单，适合前端项目。
Netlify：提供 CI/CD 功能，支持自定义域名和 HTTPS。
GitHub Pages：免费托管静态站点，需配置 homepage 字段并推送 build 文件夹。

通过 Node.js 服务器部署

若需服务端渲染（SSR）或 API 集成，可使用 Node.js 服务器：

react服务如何部署

使用 express 托管静态文件：

const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'build')));
app.listen(3000);

结合 pm2 守护进程：
```
pm2 start server.js --name "react-app"
```

容器化部署（Docker）

适合需要隔离环境或微服务架构的场景：

react服务如何部署

创建 Dockerfile：

FROM node:alpine
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
RUN npm run build
CMD ["npm", "start"]

构建并运行容器：

docker build -t react-app .
docker run -p 3000:3000 react-app

云平台部署（AWS、GCP 等）

AWS S3 + CloudFront：将 build 文件上传至 S3，通过 CloudFront 加速分发。
Google Firebase：使用 firebase deploy 快速部署到 Firebase Hosting。

CI/CD 自动化

集成 GitHub Actions 或 GitLab CI：

示例 GitHub Actions 配置：

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - run: npm install && npm run build
      - uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./build