docker
This commit is contained in:
32
Dockerfile
Normal file
32
Dockerfile
Normal file
@@ -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;"]
|
||||||
20
Dockerfile.dev
Normal file
20
Dockerfile.dev
Normal file
@@ -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"]
|
||||||
36
README.md
36
README.md
@@ -71,6 +71,7 @@ Quant Speed 是一家专注于推动线下AI变革的科技公司,通过软硬
|
|||||||
|
|
||||||
- Node.js 14.0 或更高版本
|
- Node.js 14.0 或更高版本
|
||||||
- npm 6.0 或更高版本
|
- npm 6.0 或更高版本
|
||||||
|
- Docker 和 Docker Compose(可选,用于容器化部署)
|
||||||
|
|
||||||
### 安装步骤
|
### 安装步骤
|
||||||
|
|
||||||
@@ -95,6 +96,26 @@ npm start
|
|||||||
|
|
||||||
启动后,应用将在 http://localhost:3000 上运行。开发服务器支持热重载,修改代码后浏览器会自动刷新。
|
启动后,应用将在 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
|
```bash
|
||||||
@@ -140,7 +161,18 @@ npm test
|
|||||||
|
|
||||||
### 部署方式
|
### 部署方式
|
||||||
|
|
||||||
1. **静态网站托管**
|
1. **使用 Docker 部署(推荐)**
|
||||||
|
|
||||||
|
最简单的部署方式是使用 Docker 和 Docker Compose:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 构建并启动生产环境容器
|
||||||
|
docker-compose up --build -d
|
||||||
|
```
|
||||||
|
|
||||||
|
这将使用 Nginx 服务器部署应用,可通过 http://localhost 访问。
|
||||||
|
|
||||||
|
2. **静态网站托管**
|
||||||
|
|
||||||
将 `build` 目录中的内容部署到任何静态网站托管服务,如:
|
将 `build` 目录中的内容部署到任何静态网站托管服务,如:
|
||||||
- GitHub Pages
|
- GitHub Pages
|
||||||
@@ -148,7 +180,7 @@ npm test
|
|||||||
- Vercel
|
- Vercel
|
||||||
- AWS S3 + CloudFront
|
- AWS S3 + CloudFront
|
||||||
|
|
||||||
2. **自定义服务器部署**
|
3. **自定义服务器部署**
|
||||||
|
|
||||||
可以使用Nginx等Web服务器部署静态文件:
|
可以使用Nginx等Web服务器部署静态文件:
|
||||||
|
|
||||||
|
|||||||
14
docker-compose.yml
Normal file
14
docker-compose.yml
Normal file
@@ -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
|
||||||
@@ -160,6 +160,11 @@ const ContactSection = ({ isActive }) => {
|
|||||||
transition={{ duration: 1, delay: 1.2 }}
|
transition={{ duration: 1, delay: 1.2 }}
|
||||||
>
|
>
|
||||||
<p>© 2024 Radiant AI. 创新科技,引领未来。</p>
|
<p>© 2024 Radiant AI. 创新科技,引领未来。</p>
|
||||||
|
<p>
|
||||||
|
<a href="https://beian.miit.gov.cn" target="_blank" rel="noopener noreferrer" style={{ color: 'var(--text-secondary)', textDecoration: 'none', fontSize: '0.9rem' }}>
|
||||||
|
滇ICP备2025071546号-1
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user