mirror of
https://github.com/setube/ogame-vue-ts.git
synced 2026-05-12 07:55:11 +08:00
feat(docker): 添加完整的 Docker 构建支持
- 重构 Dockerfile 支持本地完整源码构建流程 - 添加 CI 专用的 Dockerfile.ci 使用预构建产物 - 创建 .dockerignore 和 .dockerignore.ci 文件优化构建上下文 - 添加 build-docker.sh 和 build-docker.bat 本地构建脚本 - 更新 GitHub Actions 工作流支持 Node.js 环境和 pnpm 依赖管理 - 添加 DOCKER.md 详细说明文档 - 优化 nginx 配置和端口暴露设置
This commit is contained in:
31
.dockerignore
Normal file
31
.dockerignore
Normal file
@@ -0,0 +1,31 @@
|
|||||||
|
# 排除不需要的文件和目录,减少 Docker 构建上下文大小
|
||||||
|
|
||||||
|
# 开发工具
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
|
*.swp
|
||||||
|
*.swo
|
||||||
|
|
||||||
|
# Git
|
||||||
|
.git/
|
||||||
|
.gitignore
|
||||||
|
|
||||||
|
# 构建产物(本地构建时会重新生成)
|
||||||
|
docs/
|
||||||
|
pkg/
|
||||||
|
|
||||||
|
# 临时文件
|
||||||
|
*.tmp
|
||||||
|
*.temp
|
||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
||||||
|
|
||||||
|
# CI 相关文件
|
||||||
|
.github/
|
||||||
|
Dockerfile.ci
|
||||||
|
|
||||||
|
# 其他不需要的目录
|
||||||
|
android/app/build/
|
||||||
|
android/.gradle/
|
||||||
|
resources/
|
||||||
|
electron/dist/
|
||||||
38
.dockerignore.ci
Normal file
38
.dockerignore.ci
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
# CI 构建专用的 dockerignore
|
||||||
|
# 只保留构建产物和必要的配置文件
|
||||||
|
|
||||||
|
# 排除所有源代码和开发文件
|
||||||
|
src/
|
||||||
|
public/
|
||||||
|
electron/
|
||||||
|
node_modules/
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
|
.git/
|
||||||
|
.github/
|
||||||
|
|
||||||
|
# 排除构建工具配置
|
||||||
|
vite.config.ts
|
||||||
|
tsconfig*.json
|
||||||
|
*.config.js
|
||||||
|
*.config.ts
|
||||||
|
package.json
|
||||||
|
package-lock.json
|
||||||
|
pnpm-lock.yaml
|
||||||
|
|
||||||
|
# 排除其他构建产物
|
||||||
|
pkg/
|
||||||
|
android/
|
||||||
|
resources/
|
||||||
|
|
||||||
|
# 排除临时文件
|
||||||
|
*.tmp
|
||||||
|
*.temp
|
||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
||||||
|
*.log
|
||||||
|
|
||||||
|
# 只保留以下文件:
|
||||||
|
# - docs/ (构建产物)
|
||||||
|
# - nginx.conf (nginx配置)
|
||||||
|
# - Dockerfile.ci
|
||||||
41
.github/workflows/ogame-vue-ts.yml
vendored
41
.github/workflows/ogame-vue-ts.yml
vendored
@@ -1,4 +1,4 @@
|
|||||||
name: Docker 多架构构建并发布
|
name: 构建并发布 Docker 镜像
|
||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
@@ -19,6 +19,41 @@ jobs:
|
|||||||
with:
|
with:
|
||||||
fetch-depth: 0
|
fetch-depth: 0
|
||||||
|
|
||||||
|
# 设置 Node.js 环境
|
||||||
|
- name: 设置 Node.js
|
||||||
|
uses: actions/setup-node@v4
|
||||||
|
with:
|
||||||
|
node-version: '20'
|
||||||
|
|
||||||
|
# 设置 pnpm
|
||||||
|
- name: 设置 pnpm
|
||||||
|
uses: pnpm/action-setup@v4
|
||||||
|
with:
|
||||||
|
version: latest
|
||||||
|
|
||||||
|
# 缓存 pnpm 依赖
|
||||||
|
- name: 缓存 pnpm 依赖
|
||||||
|
uses: actions/cache@v4
|
||||||
|
with:
|
||||||
|
path: ~/.pnpm-store
|
||||||
|
key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
|
||||||
|
restore-keys: |
|
||||||
|
${{ runner.os }}-pnpm-
|
||||||
|
|
||||||
|
# 安装依赖
|
||||||
|
- name: 安装依赖
|
||||||
|
run: pnpm install
|
||||||
|
|
||||||
|
# 构建项目
|
||||||
|
- name: 构建项目
|
||||||
|
run: pnpm run build
|
||||||
|
|
||||||
|
# 准备 CI 构建环境
|
||||||
|
- name: 准备 CI 构建环境
|
||||||
|
run: |
|
||||||
|
# 使用 CI 专用的 dockerignore
|
||||||
|
cp .dockerignore.ci .dockerignore
|
||||||
|
|
||||||
# QEMU 用于支持多架构构建(必须)
|
# QEMU 用于支持多架构构建(必须)
|
||||||
- name: 设置 QEMU
|
- name: 设置 QEMU
|
||||||
uses: docker/setup-qemu-action@v3
|
uses: docker/setup-qemu-action@v3
|
||||||
@@ -43,11 +78,12 @@ jobs:
|
|||||||
username: ${{ vars.DOCKERHUB_USERNAME }}
|
username: ${{ vars.DOCKERHUB_USERNAME }}
|
||||||
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
password: ${{ secrets.DOCKERHUB_TOKEN }}
|
||||||
|
|
||||||
# 真正一键构建 + 推送多架构镜像(amd64 + arm64)
|
# 构建并推送多架构镜像(使用构建产物)
|
||||||
- name: 构建并推送多架构镜像
|
- name: 构建并推送多架构镜像
|
||||||
uses: docker/build-push-action@v6
|
uses: docker/build-push-action@v6
|
||||||
with:
|
with:
|
||||||
context: .
|
context: .
|
||||||
|
file: ./Dockerfile.ci
|
||||||
platforms: linux/amd64,linux/arm64
|
platforms: linux/amd64,linux/arm64
|
||||||
push: true
|
push: true
|
||||||
tags: |
|
tags: |
|
||||||
@@ -58,4 +94,3 @@ jobs:
|
|||||||
cache-from: type=gha
|
cache-from: type=gha
|
||||||
cache-to: type=gha,mode=max
|
cache-to: type=gha,mode=max
|
||||||
outputs: type=image,name=target,annotation-index.org.opencontainers.image.description=OGame Vue Ts
|
outputs: type=image,name=target,annotation-index.org.opencontainers.image.description=OGame Vue Ts
|
||||||
no-cache: true
|
|
||||||
|
|||||||
89
DOCKER.md
Normal file
89
DOCKER.md
Normal file
@@ -0,0 +1,89 @@
|
|||||||
|
# Docker 构建说明
|
||||||
|
|
||||||
|
本项目支持两种 Docker 构建方式:
|
||||||
|
|
||||||
|
## 🏠 本地构建
|
||||||
|
|
||||||
|
### 方式一:使用构建脚本(推荐)
|
||||||
|
|
||||||
|
**Linux/macOS:**
|
||||||
|
```bash
|
||||||
|
chmod +x build-docker.sh
|
||||||
|
./build-docker.sh
|
||||||
|
```
|
||||||
|
|
||||||
|
**Windows:**
|
||||||
|
```cmd
|
||||||
|
build-docker.bat
|
||||||
|
```
|
||||||
|
|
||||||
|
### 方式二:直接使用 Docker 命令
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 构建镜像
|
||||||
|
docker build -t ogame-vue-ts:local .
|
||||||
|
|
||||||
|
# 运行容器
|
||||||
|
docker run -p 8080:80 ogame-vue-ts:local
|
||||||
|
```
|
||||||
|
|
||||||
|
## ☁️ GitHub Actions 自动构建
|
||||||
|
|
||||||
|
当代码推送到 `main` 分支或创建 tag 时,GitHub Actions 会自动:
|
||||||
|
|
||||||
|
1. 在 Actions 环境中构建项目
|
||||||
|
2. 使用构建产物创建 Docker 镜像
|
||||||
|
3. 推送到 GitHub Container Registry 和 Docker Hub
|
||||||
|
|
||||||
|
### 使用预构建镜像
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# 从 GitHub Container Registry 拉取
|
||||||
|
docker pull ghcr.io/your-username/ogame-vue-ts:latest
|
||||||
|
|
||||||
|
# 从 Docker Hub 拉取(如果配置了)
|
||||||
|
docker pull your-dockerhub-username/ogame-vue-ts:latest
|
||||||
|
|
||||||
|
# 运行
|
||||||
|
docker run -p 8080:80 ghcr.io/your-username/ogame-vue-ts:latest
|
||||||
|
```
|
||||||
|
|
||||||
|
## 📁 文件说明
|
||||||
|
|
||||||
|
- `Dockerfile` - 本地构建用,包含完整的源代码构建流程
|
||||||
|
- `Dockerfile.ci` - GitHub Actions 构建用,使用预构建产物
|
||||||
|
- `.dockerignore` - 本地构建时排除的文件
|
||||||
|
- `.dockerignore.ci` - CI 构建时排除的文件
|
||||||
|
- `build-docker.sh` / `build-docker.bat` - 本地构建便捷脚本
|
||||||
|
|
||||||
|
## 🔧 配置说明
|
||||||
|
|
||||||
|
### GitHub Actions 环境变量
|
||||||
|
|
||||||
|
需要在 GitHub 仓库设置中配置:
|
||||||
|
|
||||||
|
**Variables (公开):**
|
||||||
|
- `DOCKERHUB_USERNAME` - Docker Hub 用户名(可选)
|
||||||
|
|
||||||
|
**Secrets (私密):**
|
||||||
|
- `DOCKERHUB_TOKEN` - Docker Hub 访问令牌(可选)
|
||||||
|
- `GITHUB_TOKEN` - 自动提供,用于 GHCR
|
||||||
|
|
||||||
|
### 本地构建要求
|
||||||
|
|
||||||
|
- Docker
|
||||||
|
- 足够的磁盘空间(构建过程中会下载 Node.js 依赖)
|
||||||
|
|
||||||
|
## 🚀 快速开始
|
||||||
|
|
||||||
|
1. **本地开发测试:**
|
||||||
|
```bash
|
||||||
|
./build-docker.sh
|
||||||
|
docker run -p 8080:80 ogame-vue-ts:local
|
||||||
|
```
|
||||||
|
|
||||||
|
2. **访问应用:**
|
||||||
|
打开浏览器访问 `http://localhost:8080`
|
||||||
|
|
||||||
|
3. **生产部署:**
|
||||||
|
使用 GitHub Actions 自动构建的镜像进行部署
|
||||||
38
Dockerfile
38
Dockerfile
@@ -1,22 +1,40 @@
|
|||||||
FROM node:lts-alpine AS builder
|
# 本地构建用的 Dockerfile
|
||||||
|
# 支持完整的源代码构建流程
|
||||||
|
|
||||||
RUN mkdir -p /workspace
|
FROM node:20-alpine AS builder
|
||||||
WORKDIR /workspace
|
|
||||||
RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.ustc.edu.cn/g' /etc/apk/repositories
|
|
||||||
RUN apk update && apk add git
|
|
||||||
RUN npm config set registry https://registry.npmmirror.com
|
|
||||||
RUN git clone https://github.com/setube/ogame-vue-ts.git
|
|
||||||
RUN mv ./ogame-vue-ts/* . ; rm -rf ./ogame-vue-ts/
|
|
||||||
|
|
||||||
RUN npm install -g pnpm ; pnpm install;
|
# 设置工作目录
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
# 复制 package 文件
|
||||||
|
COPY package.json pnpm-lock.yaml ./
|
||||||
|
|
||||||
|
# 安装 pnpm
|
||||||
|
RUN npm install -g pnpm
|
||||||
|
|
||||||
|
# 安装依赖
|
||||||
|
RUN pnpm install --frozen-lockfile
|
||||||
|
|
||||||
|
# 复制源代码
|
||||||
|
COPY . .
|
||||||
|
|
||||||
|
# 构建项目
|
||||||
RUN pnpm run build
|
RUN pnpm run build
|
||||||
|
|
||||||
|
# 生产阶段
|
||||||
FROM nginx:alpine
|
FROM nginx:alpine
|
||||||
|
|
||||||
|
# 复制 nginx 配置文件
|
||||||
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||||
|
|
||||||
|
# 清理默认的 nginx 静态文件
|
||||||
RUN rm -rf /usr/share/nginx/html/*
|
RUN rm -rf /usr/share/nginx/html/*
|
||||||
COPY --from=builder /workspace/docs /usr/share/nginx/html
|
|
||||||
|
|
||||||
|
# 复制构建产物到 nginx 静态文件目录
|
||||||
|
COPY --from=builder /app/docs /usr/share/nginx/html
|
||||||
|
|
||||||
|
# 暴露端口
|
||||||
EXPOSE 80
|
EXPOSE 80
|
||||||
|
|
||||||
|
# 启动 nginx
|
||||||
CMD ["nginx", "-g", "daemon off;"]
|
CMD ["nginx", "-g", "daemon off;"]
|
||||||
20
Dockerfile.ci
Normal file
20
Dockerfile.ci
Normal file
@@ -0,0 +1,20 @@
|
|||||||
|
# GitHub Actions 构建用的 Dockerfile
|
||||||
|
# 使用预构建的产物,不包含源代码构建过程
|
||||||
|
|
||||||
|
FROM nginx:alpine
|
||||||
|
|
||||||
|
# 复制 nginx 配置文件
|
||||||
|
COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||||
|
|
||||||
|
# 清理默认的 nginx 静态文件
|
||||||
|
RUN rm -rf /usr/share/nginx/html/*
|
||||||
|
|
||||||
|
# 复制构建产物到 nginx 静态文件目录
|
||||||
|
# 这里的 docs 目录是在 GitHub Actions 中构建生成的
|
||||||
|
COPY docs /usr/share/nginx/html
|
||||||
|
|
||||||
|
# 暴露端口
|
||||||
|
EXPOSE 80
|
||||||
|
|
||||||
|
# 启动 nginx
|
||||||
|
CMD ["nginx", "-g", "daemon off;"]
|
||||||
17
build-docker.bat
Normal file
17
build-docker.bat
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
@echo off
|
||||||
|
REM 本地 Docker 构建脚本 (Windows)
|
||||||
|
REM 使用完整的源代码构建流程
|
||||||
|
|
||||||
|
echo 🚀 开始本地 Docker 构建...
|
||||||
|
|
||||||
|
REM 构建镜像
|
||||||
|
docker build -t ogame-vue-ts:local .
|
||||||
|
|
||||||
|
if %ERRORLEVEL% EQU 0 (
|
||||||
|
echo ✅ Docker 镜像构建成功!
|
||||||
|
echo 📦 镜像标签: ogame-vue-ts:local
|
||||||
|
echo 🏃 运行命令: docker run -p 8080:80 ogame-vue-ts:local
|
||||||
|
) else (
|
||||||
|
echo ❌ Docker 镜像构建失败!
|
||||||
|
exit /b 1
|
||||||
|
)
|
||||||
18
build-docker.sh
Normal file
18
build-docker.sh
Normal file
@@ -0,0 +1,18 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
# 本地 Docker 构建脚本
|
||||||
|
# 使用完整的源代码构建流程
|
||||||
|
|
||||||
|
echo "🚀 开始本地 Docker 构建..."
|
||||||
|
|
||||||
|
# 构建镜像
|
||||||
|
docker build -t ogame-vue-ts:local .
|
||||||
|
|
||||||
|
if [ $? -eq 0 ]; then
|
||||||
|
echo "✅ Docker 镜像构建成功!"
|
||||||
|
echo "📦 镜像标签: ogame-vue-ts:local"
|
||||||
|
echo "🏃 运行命令: docker run -p 8080:80 ogame-vue-ts:local"
|
||||||
|
else
|
||||||
|
echo "❌ Docker 镜像构建失败!"
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
Reference in New Issue
Block a user