Skip to content
Astro Swiss Theme

Deployment

Goal: Deploy to Netlify in 5 minutes.

Deploy your Astro Swiss Theme site to production in minutes. These deployment instructions work for both the free starter theme and the paid version.

Building for Production

Section titled “Building for Production”

Build Command

Section titled “Build Command”
Terminal window
npm run build

This creates an optimized production build in the dist/ folder.

Preview Build Locally

Section titled “Preview Build Locally”

Before deploying, test your production build:

Terminal window
npm run preview

Visit http://localhost:4321 to preview the built site.

Build Output

Section titled “Build Output”

The build process:

  1. ✅ Compiles TypeScript to JavaScript
  2. ✅ Optimizes and bundles CSS
  3. ✅ Minifies HTML
  4. ✅ Optimizes images
  5. ✅ Generates static routes for all languages
  6. ✅ Creates sitemap (if configured)

Output structure:

dist/
├── index.html           # French homepage (default locale)
├── de/
│   └──index.html      # German homepage
├── _astro/             # Bundled CSS and JS
├── fonts/              # Font files
└── favicon.svg

Deploy to Netlify (Primary)

Section titled “Deploy to Netlify (Primary)”

Why Netlify?

  • Simple configuration
  • Automatic HTTPS & CDN
  • GitHub integration
  • Free tier available

Netlify

Section titled “Netlify”

  1. Create netlify.toml in project root:

    netlify.toml
    [build]
      command = "npm run build"
      publish = "dist"
    

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

  2. Deploy:

    • Via Dashboard: Go to netlify.com and import your repository
    • Via CLI:
      Terminal window
      npm install -g netlify-cli
      netlify deploy --prod

Alternative: Vercel

Section titled “Alternative: Vercel”

Vercel auto-detects Astro projects - no configuration file needed:

  1. Go to vercel.com and import your GitHub repository
  2. Vercel automatically configures build settings
  3. Click “Deploy”

Or use CLI:

Terminal window
npm i -g vercel
vercel

Environment Variables

Section titled “Environment Variables”

Public Variables

Section titled “Public Variables”

Variables prefixed with PUBLIC_ are available in client-side code.

Create .env file:

.env
PUBLIC_SITE_URL=https://yourdomain.com
PUBLIC_GA_ID=G-XXXXXXXXXX

Use in components:

---
const siteUrl = import.meta.env.PUBLIC_SITE_URL;
---


<meta property="og:url" content={siteUrl} />

Private Variables

Section titled “Private Variables”

Variables without PUBLIC_ prefix are only available server-side.

.env
API_KEY=secret-key-here
DATABASE_URL=postgres://...

Platform-Specific Setup

Section titled “Platform-Specific Setup”

Add variables in Project Settings → Environment Variables

License Note

Section titled “License Note”

Custom Domain

Section titled “Custom Domain”
  1. Go to Project Settings → Domains
  2. Add your domain
  3. Update DNS records as instructed

Next Steps

Section titled “Next Steps”