PLANTILLA DE PIPELINE CI/CD (GITHUB ACTIONS)
Uso: Copiar este archivo en
.github/workflows/ci.ymlen la raíz de cualquier proyecto nuevo de la agencia. Bloqueará automáticamente cualquier Pull Request o commit que rompa el tipado, falle tests o intente fugar secretos.
Archivo: .github/workflows/ci.yml
yaml
name: CI / Quality & Security Pipeline
on:
push:
branches: [main, develop]
pull_request:
branches: [main, develop]
jobs:
validate:
name: Lint, Types, Secrets & Tests
runs-on: ubuntu-latest
steps:
- name: 📥 Checkout del Código
uses: actions/checkout@v4
- name: ⚙️ Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 20
cache: 'npm'
- name: 📦 Instalar Dependencias
run: npm ci
- name: 🔍 1. Validación de Tipos (TypeScript)
run: npx tsc --noEmit
- name: 🧹 2. Linter de Código
run: npm run lint
- name: 🧪 3. Pruebas Automatizadas (Vitest)
run: npm run test:ci || npx vitest run
- name: 🏗️ 4. Compilación del Proyecto
run: npm run build
- name: 🛡️ 5. Escaneo de Secretos en el Bundle
run: node tools/scan-bundle-secrets.mjs dist || echo "Verificado con scan-secrets"
deploy-staging:
name: Deploy to Cloudflare Pages (Preview)
needs: validate
if: github.event_name == 'pull_request'
runs-on: ubuntu-latest
steps:
- name: 📥 Checkout
uses: actions/checkout@v4
- name: ⚙️ Setup Node
uses: actions/setup-node@v4
with:
node-version: 20
- name: 📦 Install & Build
run: |
npm ci
npm run build
- name: 🚀 Despliegue de Preview en Cloudflare Pages
uses: cloudflare/pages-action@v1
with:
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
projectName: ${{ vars.CLOUDFLARE_PROJECT_NAME }}
directory: dist
gitHubToken: ${{ secrets.GITHUB_TOKEN }}Configuración de Secretos en GitHub
En tu repositorio de GitHub (Settings ➔ Secrets and variables ➔ Actions), configurar:
| Secreto / Variable | Tipo | Descripción |
|---|---|---|
CLOUDFLARE_API_TOKEN | Secret | Token de API de Cloudflare con permisos de Pages / Workers |
CLOUDFLARE_ACCOUNT_ID | Secret | ID de cuenta de Cloudflare |
CLOUDFLARE_PROJECT_NAME | Variable | Nombre del proyecto en Cloudflare Pages |