/add-deployment

Add a new deployment target to your existing Odoo PWA project.

What this command does:

Adds deployment configuration for new platforms
Creates necessary config files
Sets up CI/CD workflows
Provides deployment instructions
Configures environment variables

Supported Deployment Targets

Primary (Recommended)

✅ Vercel - Best for full-stack PWAs (API routes work)
✅ Netlify - Great for static + serverless functions
✅ Cloudflare Pages - Fast global CDN, edge functions

Secondary (Static Only)

⚠️ GitHub Pages - Free, but no server-side code
⚠️ Cloudflare Pages (Static) - Without edge functions
⚠️ AWS S3 + CloudFront - Static hosting only

Prerequisites

Before adding deployment:

□ Project builds successfully (npm run build)
□ Odoo connection tested and working
□ Environment variables documented
□ Git repository initialized
□ Code committed to version control

Add Vercel Deployment 🔷

What You'll Get:

Automatic deployments from Git
Serverless API routes
Preview deployments for PRs
Environment variable management
Custom domains
Analytics and logs

Steps:

1. Install Vercel CLI (Optional)

npm install -g vercel

2. Create `vercel.json`

{
  "buildCommand": "npm run build",
  "outputDirectory": "build",
  "framework": "sveltekit",
  "installCommand": "npm install",
  "devCommand": "npm run dev",
  "env": {
    "VITE_ODOO_URL": "@vite_odoo_url",
    "VITE_ODOO_DB": "@vite_odoo_db",
    "VITE_MODEL_NAME": "@vite_model_name",
    "VITE_MODEL_DISPLAY_NAME": "@vite_model_display_name"
  },
  "build": {
    "env": {
      "ODOO_API_KEY": "@odoo_api_key",
      "ODOO_USERNAME": "@odoo_username"
    }
  }
}

For React/Vue:

{
  "buildCommand": "npm run build",
  "outputDirectory": "dist",
  "framework": "vite"
}

3. Create `.vercelignore`

node_modules
.env
.env.local
*.log
.DS_Store

4. Deployment Options

Option A: Vercel Dashboard (Recommended for first time)

Go to https://vercel.com/new
Connect your Git repository
Vercel auto-detects framework
Add environment variables:
- VITE_ODOO_URL
- VITE_ODOO_DB
- ODOO_API_KEY
- ODOO_USERNAME
- VITE_MODEL_NAME
- VITE_MODEL_DISPLAY_NAME
Click "Deploy"

Option B: Vercel CLI

vercel login
vercel

# Follow prompts
# Add environment variables when asked
# Or add them later in dashboard

Option C: Continuous Deployment

Connect repository to Vercel
Every push to main auto-deploys
PRs get preview deployments

5. Configure Environment Variables

In Vercel Dashboard:

Go to Project Settings
Environment Variables tab
Add each variable:
- Production
- Preview (optional)
- Development (optional)

6. Test Deployment

Wait for build to complete
Visit deployed URL
Test Odoo connection
Verify all features work
Check browser console for errors

Add Netlify Deployment 🟢

What You'll Get:

Git-based deployments
Serverless functions
Form handling
Split testing
Deploy previews
Custom domains

Steps:

1. Create `netlify.toml`

[build]
  command = "npm run build"
  publish = "build"

[build.environment]
  NODE_VERSION = "18"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

[functions]
  directory = "netlify/functions"

For React/Vue:

[build]
  command = "npm run build"
  publish = "dist"

2. Convert API Routes to Netlify Functions

Create netlify/functions/odoo.js:

// Copy your API route logic here
// Netlify functions use different format

exports.handler = async (event, context) => {
  // Parse request
  const body = JSON.parse(event.body);

  // Your Odoo logic here
  // (copy from src/routes/api/odoo/+server.js)

  return {
    statusCode: 200,
    body: JSON.stringify(result)
  };
};

3. Update Client to Use Netlify Function

// Change API endpoint
const response = await fetch('/.netlify/functions/odoo', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify(data)
});

4. Deploy

Option A: Netlify Dashboard

Go to https://app.netlify.com/start
Connect repository
Configure build settings
Add environment variables
Deploy

Option B: Netlify CLI

npm install -g netlify-cli
netlify login
netlify init
netlify deploy --prod

Add Cloudflare Pages Deployment 🟠

What You'll Get:

Global CDN
Unlimited bandwidth
Edge functions
Preview deployments
Web Analytics
Fast performance

Steps:

1. Create `wrangler.toml` (for edge functions)

name = "odoo-pwa"
compatibility_date = "2025-01-01"

[build]
command = "npm run build"

[build.upload]
format = "service-worker"

2. Convert API Routes to Workers

Create functions/odoo.js:

export async function onRequest(context) {
  const { request, env } = context;

  // Parse request
  const body = await request.json();

  // Odoo logic here
  // Access env vars via env.ODOO_API_KEY

  return new Response(JSON.stringify(result), {
    headers: { 'Content-Type': 'application/json' }
  });
}

3. Deploy

Option A: Cloudflare Dashboard

Go to Cloudflare Pages
Connect Git repository
Configure build:
- Build command: npm run build
- Output: build or dist
Add environment variables
Deploy

Option B: Wrangler CLI

npm install -g wrangler
wrangler login
wrangler pages project create odoo-pwa
wrangler pages publish build

Add GitHub Pages Deployment 📘

⚠️ Limitations:

Static hosting only
No server-side API routes
Must modify Odoo client for direct API calls
CORS issues possible

When to Use:

Demo projects
Public apps (no sensitive data)
Frontend-only versions

Steps:

1. Update Base Path

SvelteKit (svelte.config.js):

const config = {
  kit: {
    adapter: adapter({
      pages: 'build',
      assets: 'build',
      fallback: 'index.html'
    }),
    paths: {
      base: process.env.NODE_ENV === 'production'
        ? '/your-repo-name'
        : ''
    }
  }
};

React/Vue (vite.config.js):

export default {
  base: '/your-repo-name/'
};

2. Create `.github/workflows/deploy.yml`

name: Deploy to GitHub Pages

on:
  push:
    branches: [main]

permissions:
  contents: read
  pages: write
  id-token: write

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'

      - run: npm install

      - run: npm run build
        env:
          VITE_ODOO_URL: ${{ secrets.VITE_ODOO_URL }}
          VITE_ODOO_DB: ${{ secrets.VITE_ODOO_DB }}
          VITE_MODEL_NAME: ${{ secrets.VITE_MODEL_NAME }}

      - uses: actions/upload-pages-artifact@v3
        with:
          path: build

  deploy:
    runs-on: ubuntu-latest
    needs: build

    steps:
      - uses: actions/deploy-pages@v4

3. Configure Repository

Go to Settings → Pages
Source: GitHub Actions
Save

4. Add Secrets

Settings → Secrets and variables → Actions
Add each environment variable

5. Push to Deploy

git add .
git commit -m "Add GitHub Pages deployment"
git push origin main

Environment Variables Reference

Required for All Platforms:

# Public (VITE_ prefix for client access)
VITE_ODOO_URL=https://yourcompany.odoo.com
VITE_ODOO_DB=yourcompany-main
VITE_MODEL_NAME=x_expense
VITE_MODEL_DISPLAY_NAME=Expense

# Private (server-side only)
ODOO_API_KEY=your_production_api_key
ODOO_USERNAME=your.email@company.com

Platform-Specific:

Vercel:

Add in Project Settings → Environment Variables
Separate for Production/Preview/Development

Netlify:

Add in Site Settings → Environment Variables
Or in netlify.toml

Cloudflare:

Add in Pages → Settings → Environment Variables
Or use Wrangler secrets

GitHub Pages:

Add in Repository Settings → Secrets
Used in GitHub Actions workflow

Post-Deployment Checklist ✅

After deploying to new platform:

□ Build completed successfully
□ Application loads at deployment URL
□ Odoo connection works
□ Data syncs correctly
□ CRUD operations work
□ Offline mode functions
□ Service worker registered
□ PWA installs correctly
□ Environment variables set correctly
□ No console errors
□ Tested on mobile
□ Custom domain configured (if needed)

Multi-Platform Deployment

Deploy to Multiple Platforms:

You can deploy the same app to multiple platforms for:

Redundancy
A/B testing
Different regions
Different audiences

Example Setup:

main branch → Vercel (primary production)
staging branch → Netlify (staging)
PRs → Vercel preview deployments

Troubleshooting Deployment

Build Fails

Check build logs
Test npm run build locally
Verify Node version matches
Check for missing env vars

App Loads but Doesn't Work

Check environment variables are set
Look at browser console errors
Verify API routes deployed correctly
Test Odoo connection

API Routes Not Working

Verify platform supports server-side code
Check function logs
Ensure correct paths used
Test API endpoint directly

Example prompts to use this command:

/add-deployment - Add new deployment target
User: "Deploy to Netlify"
User: "Add Cloudflare deployment"
User: "Set up continuous deployment"

Related Commands:

/deploy-vercel - Deploy to Vercel
/deploy-github - Deploy to GitHub Pages
/test-connection - Test before deploying
/optimize - Optimize before production

Best Practices

Use Git-Based Deployment
- Automatic on push
- Preview deployments
- Easy rollbacks
Separate Environments
- Development
- Staging
- Production
Secure Secrets
- Never commit API keys
- Use platform secret management
- Rotate keys regularly
Monitor Deployments
- Set up error tracking
- Monitor performance
- Watch build times
Test Before Merging
- Use preview deployments
- Test all features
- Check on real devices

What this command does:

Supported Deployment Targets

Primary (Recommended)

Secondary (Static Only)

Prerequisites

Add Vercel Deployment 🔷

What You'll Get:

Steps:

1. Install Vercel CLI (Optional)

2. Create vercel.json

3. Create .vercelignore

4. Deployment Options

5. Configure Environment Variables

6. Test Deployment

Add Netlify Deployment 🟢

What You'll Get:

Steps:

1. Create netlify.toml

2. Convert API Routes to Netlify Functions

3. Update Client to Use Netlify Function

4. Deploy

Add Cloudflare Pages Deployment 🟠

What You'll Get:

Steps:

1. Create wrangler.toml (for edge functions)

2. Convert API Routes to Workers

3. Deploy

Add GitHub Pages Deployment 📘

⚠️ Limitations:

When to Use:

Steps:

1. Update Base Path

2. Create .github/workflows/deploy.yml

3. Configure Repository

4. Add Secrets

5. Push to Deploy

Environment Variables Reference

Required for All Platforms:

Platform-Specific:

Post-Deployment Checklist ✅

Multi-Platform Deployment

Deploy to Multiple Platforms:

Example Setup:

Troubleshooting Deployment

Build Fails

App Loads but Doesn't Work

API Routes Not Working

Example prompts to use this command:

Related Commands:

Best Practices

Other plugins with /add-deployment

2. Create `vercel.json`

3. Create `.vercelignore`

1. Create `netlify.toml`

1. Create `wrangler.toml` (for edge functions)

2. Create `.github/workflows/deploy.yml`