From 40b1e48f112c0a8ce4b6f21cfc7b636cf407836e Mon Sep 17 00:00:00 2001
From: "n72595987@gmail.com" <uqD@qksCrfnNXW94eskvHzp@9U4mBc>
Date: Sat, 29 Nov 2025 17:04:57 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20Drone=20CI/CD=20=E5=89=8D?=
 =?UTF-8?q?=E7=AB=AF=E8=87=AA=E5=8A=A8=E5=8C=96=E9=83=A8=E7=BD=B2=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. 新增 .drone.yml 配置文件
   - 自动安装 npm 依赖
   - 自动构建生产版本
   - 构建 Docker 镜像
   - 自动部署到生产服务器
   - 健康检查验证部署成功

2. 新增 Dockerfile
   - 多阶段构建：Node 编译 + Nginx 运行
   - 优化镜像体积，使用 alpine 基础镜像
   - 配置静态资源缓存
   - 添加健康检查

3. 新增 nginx.conf
   - 配置前端路由支持（Vue Router history 模式）
   - 代理 API 请求到后端服务
   - 优化 Gzip 压缩和静态资源缓存
   - 支持 BladeX 系统模块路径代理

现在推送代码后，前端会自动部署到生产环境！

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .drone.yml | 71 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Dockerfile | 37 ++++++++++++++++++++++++++++
 nginx.conf | 47 ++++++++++++++++++++++++++++++++++++
 3 files changed, 155 insertions(+)
 create mode 100644 .drone.yml
 create mode 100644 Dockerfile
 create mode 100644 nginx.conf

diff --git a/.drone.yml b/.drone.yml
new file mode 100644
index 0000000..e29a117
--- /dev/null
+++ b/.drone.yml
@@ -0,0 +1,71 @@
+kind: pipeline
+type: docker
+name: 武术系统前端自动部署
+
+# 只在 main 分支触发
+trigger:
+  branch:
+    - main
+  event:
+    - push
+
+steps:
+  # 步骤1：安装依赖
+  - name: 安装依赖
+    image: node:18-alpine
+    volumes:
+      - name: npm-cache
+        path: /root/.npm
+    commands:
+      - echo "开始安装 npm 依赖..."
+      - npm install --registry=https://registry.npmmirror.com
+      - echo "✅ 依赖安装完成"
+
+  # 步骤2：构建生产版本
+  - name: 构建前端项目
+    image: node:18-alpine
+    commands:
+      - echo "开始构建前端项目..."
+      - npm run build
+      - ls -lh dist/
+      - echo "✅ 前端构建完成"
+
+  # 步骤3：构建 Docker 镜像
+  - name: 构建Docker镜像
+    image: plugins/docker
+    settings:
+      repo: martial/frontend
+      tags:
+        - latest
+        - ${DRONE_COMMIT_SHA:0:8}
+      dockerfile: Dockerfile
+
+  # 步骤4：部署到服务器
+  - name: 部署到生产环境
+    image: appleboy/drone-ssh
+    settings:
+      host: 154.30.6.21
+      username: root
+      key:
+        from_secret: ssh_key
+      port: 22
+      script:
+        - cd /app/martial
+        - docker-compose pull frontend
+        - docker-compose up -d frontend
+        - docker ps | grep martial-frontend
+        - echo "✅ 前端部署完成"
+
+  # 步骤5：健康检查
+  - name: 健康检查
+    image: curlimages/curl:latest
+    commands:
+      - sleep 5
+      - curl -f http://154.30.6.21:2888 || exit 1
+      - echo "✅ 前端访问正常"
+
+# 挂载卷（缓存 npm 依赖）
+volumes:
+  - name: npm-cache
+    host:
+      path: /data/drone-cache/npm
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..eea30bc
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,37 @@
+# 构建阶段
+FROM node:18-alpine AS builder
+
+WORKDIR /build
+
+# 复制 package 文件
+COPY package*.json ./
+
+# 安装依赖（使用国内镜像加速）
+RUN npm install --registry=https://registry.npmmirror.com
+
+# 复制源码
+COPY . .
+
+# 构建生产版本
+RUN npm run build
+
+# 运行阶段：使用 Nginx 服务静态文件
+FROM nginx:alpine
+
+LABEL maintainer="JohnSion"
+LABEL description="武术比赛管理系统前端"
+
+# 复制构建产物到 Nginx 目录
+COPY --from=builder /build/dist /usr/share/nginx/html
+
+# 复制 Nginx 配置
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+
+# 暴露端口
+EXPOSE 80
+
+# 健康检查
+HEALTHCHECK --interval=30s --timeout=3s CMD wget -q --spider http://localhost/ || exit 1
+
+# 启动 Nginx
+CMD ["nginx", "-g", "daemon off;"]
diff --git a/nginx.conf b/nginx.conf
new file mode 100644
index 0000000..0daa0c9
--- /dev/null
+++ b/nginx.conf
@@ -0,0 +1,47 @@
+server {
+    listen 80;
+    server_name localhost;
+    
+    # 前端静态文件目录
+    root /usr/share/nginx/html;
+    index index.html;
+    
+    # Gzip 压缩
+    gzip on;
+    gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
+    
+    # 前端路由（Vue Router history 模式）
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+    
+    # API 代理到后端
+    location /api/ {
+        proxy_pass http://martial-backend:8123/api/;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+    }
+    
+    # BladeX 系统模块代理
+    location /blade-auth/ {
+        proxy_pass http://martial-backend:8123/blade-auth/;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    }
+    
+    location /blade-system/ {
+        proxy_pass http://martial-backend:8123/blade-system/;
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    }
+    
+    # 缓存静态资源
+    location ~* \.(jpg|jpeg|png|gif|ico|css|js|woff|woff2|ttf|svg)$ {
+        expires 7d;
+        add_header Cache-Control "public, immutable";
+    }
+}