diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..ff421e3 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,32 @@ +# 构建阶段 +FROM node:16-alpine AS builder + +# 设置工作目录 +WORKDIR /app + +# 复制 package.json 和 package-lock.json(如果存在) +COPY package*.json ./ + +# 安装所有依赖 +RUN npm ci + +# 复制应用源代码 +COPY . . + +# 构建应用 +RUN npm run build + +# 生产阶段 +FROM nginx:alpine + +# 复制构建结果到 nginx 服务器 +COPY --from=builder /app/build /usr/share/nginx/html + +# 复制 nginx 配置(如果需要自定义配置) +# COPY nginx.conf /etc/nginx/nginx.conf + +# 暴露端口 +EXPOSE 80 + +# 启动 nginx +CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file diff --git a/Dockerfile.dev b/Dockerfile.dev new file mode 100644 index 0000000..9669e22 --- /dev/null +++ b/Dockerfile.dev @@ -0,0 +1,20 @@ +# 使用官方 Node.js 运行时作为基础镜像 +FROM node:16-alpine + +# 设置工作目录 +WORKDIR /app + +# 复制 package.json 和 package-lock.json(如果存在) +COPY package*.json ./ + +# 安装所有依赖 +RUN npm ci + +# 复制应用源代码 +COPY . . + +# 暴露端口 +EXPOSE 3000 + +# 启动开发服务器 +CMD ["npm", "start"] \ No newline at end of file diff --git a/README.md b/README.md index 53e9c5f..65b6b33 100644 --- a/README.md +++ b/README.md @@ -71,6 +71,7 @@ Quant Speed 是一家专注于推动线下AI变革的科技公司,通过软硬 - Node.js 14.0 或更高版本 - npm 6.0 或更高版本 +- Docker 和 Docker Compose(可选,用于容器化部署) ### 安装步骤 @@ -95,6 +96,26 @@ npm start 启动后,应用将在 http://localhost:3000 上运行。开发服务器支持热重载,修改代码后浏览器会自动刷新。 +### 使用 Docker 启动(推荐) + +#### 生产环境部署 + +```bash +# 使用 Docker Compose 构建和启动生产环境 +docker-compose up --build +``` + +应用将在 http://localhost 上运行。 + +#### 开发环境部署 + +```bash +# 使用 Docker Compose 启动开发环境(支持热重载) +docker-compose -f docker-compose.dev.yml up +``` + +应用将在 http://localhost:3000 上运行,支持代码修改后的热重载。 + ### 构建生产版本 ```bash @@ -140,7 +161,18 @@ npm test ### 部署方式 -1. **静态网站托管** +1. **使用 Docker 部署(推荐)** + +最简单的部署方式是使用 Docker 和 Docker Compose: + +```bash +# 构建并启动生产环境容器 +docker-compose up --build -d +``` + +这将使用 Nginx 服务器部署应用,可通过 http://localhost 访问。 + +2. **静态网站托管** 将 `build` 目录中的内容部署到任何静态网站托管服务,如: - GitHub Pages @@ -148,7 +180,7 @@ npm test - Vercel - AWS S3 + CloudFront -2. **自定义服务器部署** +3. **自定义服务器部署** 可以使用Nginx等Web服务器部署静态文件: diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..e0e11c7 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,14 @@ +version: '3.8' + +services: + frontend: + build: + context: . + dockerfile: Dockerfile + ports: + - "80:80" + # volumes: + # 如果需要自定义 nginx 配置可以取消注释下面这行 + # - ./nginx.conf:/etc/nginx/nginx.conf + environment: + - NODE_ENV=production \ No newline at end of file diff --git a/src/components/ContactSection.js b/src/components/ContactSection.js index a0cc3a3..46c65da 100644 --- a/src/components/ContactSection.js +++ b/src/components/ContactSection.js @@ -160,6 +160,11 @@ const ContactSection = ({ isActive }) => { transition={{ duration: 1, delay: 1.2 }} >

© 2024 Radiant AI. 创新科技,引领未来。

+

+ + 滇ICP备2025071546号-1 + +

);