Now liveThe Skillselion MCP - thousands of ranked skills, loaded into your agent mid-task. No install.Get it →
igorwarzocha avatar

Security Vite

  • 86 installs
  • 125 repo stars
  • Updated February 4, 2026
  • igorwarzocha/opencode-workflows

Audit Vite SPAs for VITE_ secret exposure, build-time secrets, source maps, and dev-server proxy/host binding risks.

About

A security-audit skill for Vite apps and dev servers. A developer uses it to catch secrets leaked via the VITE_ prefix, scan bundles in dist/, and review proxy and host binding config.

  • Explains the VITE_ footgun: prefixed vars are bundled into client JS
  • Scans dist/ bundles and audits SPA server-side auth vs client route guards

Security Vite by the numbers

  • 86 all-time installs (skills.sh)
  • +4 installs in the week ending Aug 2, 2026 (Skillselion tracking)
  • Ranked #1,064 of 2,203 Security skills by installs in the Skillselion catalog
  • Data as of Aug 2, 2026 (Skillselion catalog sync)
npx skills add https://github.com/igorwarzocha/opencode-workflows --skill security-vite

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

Listed on Skillselion
Installs86
repo stars125
Last updatedFebruary 4, 2026
Repositoryigorwarzocha/opencode-workflows

What it does

Audit Vite SPAs for VITE_ secret exposure, build-time secrets, source maps, and dev-server proxy/host binding risks.

Files

SKILL.mdMarkdownGitHub ↗

<overview>

Security audit patterns for Vite applications focusing on environment variable exposure, build-time secrets, and SPA-specific vulnerabilities.

</overview>

<rules>

Environment Variable Exposure

The VITE_ Footgun

VITE_*    → Bundled into client JavaScript → Visible to everyone
No prefix → Only available in vite.config.ts → Safe for secrets

Audit steps: 1. grep -r "VITE_" . -g "*.env*" 2. Check import.meta.env.VITE_* usage in source 3. Common mistakes:

  • VITE_API_SECRET (SHOULD be server-only)
  • VITE_DATABASE_URL (MUST NOT use)
  • VITE_STRIPE_SECRET_KEY (only publishable keys)

Env Files Priority

Vite loads in this order (later overrides earlier):

.env                # Always loaded
.env.local          # Always loaded, gitignored
.env.[mode]         # e.g., .env.production
.env.[mode].local   # e.g., .env.production.local, gitignored

Check: Are .env.local and .env.*.local in .gitignore?

envPrefix Overrides

If envPrefix is configured, Vite exposes any variables with those prefixes. Treat envPrefix as a security-sensitive setting.

</rules>

<vulnerabilities>

Build-Time vs Runtime

Dangerous: Secrets in vite.config.ts

// ❌ Secret in config (ends up in bundle)
export default defineConfig({
  define: {
    'process.env.API_KEY': JSON.stringify(process.env.API_KEY),
  },
});

// The above makes API_KEY available in client code!

Safe Pattern

// Only use VITE_ prefix for truly public values
export default defineConfig({
  define: {
    '__APP_VERSION__': JSON.stringify(process.env.npm_package_version),
  },
});

// Keep secrets on server (use a backend API)

Dev Server Security

Open to Network

// ❌ Exposes dev server to network
export default defineConfig({
  server: {
    host: '0.0.0.0',  // or host: true
  },
});

This is dangerous on shared networks. Check if intentional.

Proxy Misconfiguration

export default defineConfig({
  server: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true,
        // ❌ Missing secure options for production-like setup
      },
    },
  },
});

SPA Security Issues

Client-Side Auth Only

// ❌ "Protection" only in React Router
const ProtectedRoute = ({ children }) => {
  const { user } = useAuth();
  if (!user) return <Navigate to="/login" />;
  return children;
};

// API calls still need server-side auth!
// This is UI convenience, not security.

Secrets in Bundle

# Check the built bundle for secrets
rg -a "(sk_live|sk_test|AKIA|api[_-]?key)" dist/

Source Maps in Production

// Check vite.config.ts
export default defineConfig({
  build: {
    sourcemap: true,  // ❌ Exposes source code in production
  },
});

</vulnerabilities>

<severity_table>

Common Vulnerabilities

IssueWhere to LookSeverity
VITE_* secrets.env*, source filesCRITICAL
Secrets in definevite.config.tsCRITICAL
Source maps in prodvite.config.tsMEDIUM
Dev server exposedvite.config.ts server.hostMEDIUM
Client-only authRoute guards without API authHIGH
API keys in bundledist/ directoryCRITICAL

</severity_table>

<commands>

Quick Audit Commands

# Find VITE_ secrets
grep -r "VITE_" . -g "*.env*"

# Find import.meta.env usage
rg 'import\.meta\.env' . -g "*.ts" -g "*.tsx" -g "*.vue"

# Check define in config
rg 'define:' vite.config.*

# Scan built bundle for secrets
rg -a "(sk_live|AKIA|ghp_|api[_-]?key['\"]?\s*[:=])" dist/

# Check for source maps
fd '\.map$' dist/

</commands>

<checklist>

Hardening Checklist

  • [ ] No secrets in VITE_* variables
  • [ ] .env.local and .env.*.local in .gitignore
  • [ ] sourcemap: false in production build
  • [ ] server.host is not 0.0.0.0 or true (unless intentional)
  • [ ] All sensitive API calls go through a backend (not direct from browser)
  • [ ] No secrets in vite.config.ts define block

</checklist>

Related skills

Securityappsecsecrets

This week in AI coding

Five minutes, every Monday - the tools, releases and tactics for developers.

unsubscribe anytime.