Env quickstart

Declare one Vite build value, one Nitro runtime secret, and verify both outputs.

This guide shows the two Env paths:

Public Env values exposed through #vitehub/env/public
Server Env values exposed through #vitehub/env/server

Prompt

Set up @vitehub/env in this app.

- Install @vitehub/env
- Register envVite() or envNitro()
- Declare a public build value
- Declare a server-only Runtime Env secret
- Read generated Public Env and Server Env from app code

Docs: /docs/vite/env/quickstart or /docs/nitro/env/quickstart

Install Env

pnpm add @vitehub/env

Register the integration

vite.config.ts

import { env, envVite } from '@vitehub/env/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [envVite({ prefix: 'VITEHUB_' })],
  env: {
    public: {
      appName: env({
        default: 'ViteHub Env',
        mode: 'build',
      }),
    },
  },
})

Read Env values

Read Public Env from the ViteHub public env import path:

src/main.ts

import { usePublicEnv } from '#vitehub/env/public'

const publicEnv = usePublicEnv()

document.querySelector('#app')!.textContent = publicEnv.appName

Verify the result

Set a prefixed value and start Vite:

VITEHUB_APP_NAME="Docs App" pnpm dev

The rendered page should show Docs App.

Next steps

Use Usage for defaults, optional values, explicit sources, schemas, and diagnostics.
Use Runtime API for exact declaration shapes.
Use Troubleshooting if generated types or runtime values are missing.