SvelteKit

Prerequisites

Start with a SvelteKit 3 app and Node.js. This guide uses Svelte 5 and the Node adapter for production.

Install

In your SvelteKit project, install Dotenvx.

$ npm install @dotenvx/dotenvx

$ pnpm add @dotenvx/dotenvx

Encrypt

Start with a secret value in the .env file at your project root, like:

# .env
HELLO="Secret"

Encrypt it with a single command.

$ npx dotenvx encrypt
◈ encrypted .env (022 0D8) via .env.keys ⛉

$ pnpm exec dotenvx encrypt
◈ encrypted .env (022 0D8) via .env.keys ⛉

The values become ciphertext and only your private key can unlock them.

# .env
DOTENV_PUBLIC_KEY="0220d830351410598be484f43a7b07097e09851f50426832876e8b5815a1752990"

HELLO="encrypted:BHLTACNJMr00nTG6yXpkCyWFKF/MY0ajN855tg3uVtKopTe2AGzSkQlcPd21pTOT3Ci8IKrdIg2TMZFoq1mDR6yb06QCRvqHXtpkZkAHYCEHfeWqqC8tMFovcYq5JS2uZSrC/qUGDA=="

Commit

Commit your encrypted .env files with your code. It's safe. Now you can securely share secrets through git.

$ git add .env
$ git commit -m "encrypt .env"

Ship

Declare your server variable:

// src/env.js
import { defineEnvVars } from '@sveltejs/kit/env';

export const variables = defineEnvVars({
  HELLO: {}
});

If your app already has src/env.ts, add HELLO there instead. Variables are private and loaded at runtime by default.

Read it in a server load function:

// src/routes/+page.server.js
import { HELLO } from '$app/env/private';

export function load() {
  return { hello: HELLO };
}

Display the result:

<!-- src/routes/+page.svelte -->
<script>
  let { data } = $props();
</script>

<h1>Hello {data.hello}</h1>

HELLO is a demonstration value. Load function results reach the browser; use real secrets inside server code without returning them.

Update these scripts in package.json, keeping your other scripts:

{
  "scripts": {
    "dev": "dotenvx run -- vite dev",
    "build": "vite build",
    "preview": "dotenvx run -- vite preview",
    "start": "dotenvx run -f .env.production --strict -- node build"
  }
}

Run your app:

$ npm run dev
⟐ injected env (2) from .env (022 0D8) via .env.keys

$ pnpm dev
⟐ injected env (2) from .env (022 0D8) via .env.keys

Dotenvx loads and decrypts .env before SvelteKit starts. SvelteKit makes the decrypted value available through $app/env/private on the server.

Visit http://localhost:5173 to see Hello Secret.

Public browser variables Alternative →

Share

Have teammates? Share access with Dotenvx Armor ⛨

Log in to Dotenvx.

$ npx dotenvx login
◉ logged in (username)

$ pnpm exec dotenvx login
◉ logged in (username)

Create the Armored Key ⛨

$ npx dotenvx armor up
⛨ armored .env (022 0D8)

$ pnpm exec dotenvx armor up
⛨ armored .env (022 0D8)

Invite your teammate.

$ npx dotenvx armor invite
⛨ invited [email protected] to team

$ pnpm exec dotenvx armor invite
⛨ invited [email protected] to team

Your teammate accepts the invitation, pulls the repository, installs dependencies, and logs in with dotenvx login. They can then run the app:

$ npm run dev
⟐ injected env (2) from .env (022 0D8) via Armor ⛨

$ pnpm dev
⟐ injected env (2) from .env (022 0D8) via Armor ⛨

Visit http://localhost:5173 to see Hello Secret.

Share a private key Alternative →

Production

Install the Node adapter.

$ npm install -D @sveltejs/adapter-node

$ pnpm add -D @sveltejs/adapter-node

Replace your existing adapter in vite.config.js (or vite.config.ts), keeping your other configuration:

import adapter from '@sveltejs/adapter-node';
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';

export default defineConfig({
  plugins: [sveltekit({ adapter: adapter() })]
});

Create a .env.production file.

# .env.production
HELLO="Production"

Encrypt it with an Enclaved Key ◊

$ npx dotenvx encrypt -f .env.production
◈ encrypted .env.production (022 0D8) via Armor Enclave ◊

$ pnpm exec dotenvx encrypt -f .env.production
◈ encrypted .env.production (022 0D8) via Armor Enclave ◊

When prompted, choose Enclaved, select your deployment service, connection, and resource, and use DOTENV_PRIVATE_KEY_PRODUCTION as the private key name.

Commit .env.production.

$ git add -f .env.production
$ git commit -m "encrypt .env.production"

Install dependencies and build your app in your deployment build step:

$ npm install
$ npm run build

$ pnpm install
$ pnpm build

This server-rendered example only needs its secret at runtime, so the build script does not decrypt it.

Deploy the compiled build directory, package.json, runtime dependencies, and encrypted .env.production file to the selected resource. Keep .env.production at the project root and .env.keys on your local machine.

Set PORT to the port your host expects (3000 by default). Behind a reverse proxy, configure your server origin for your deployment. From the project root, run:

$ npm start

$ pnpm start

Dotenvx loads and decrypts .env.production with your Enclaved Key ◊

Open your deployed app's URL to see Hello Production.

Build-time variables Alternative →

Deploy with a private key Alternative →

For serverless or edge deployments, follow your platform’s SvelteKit adapter and secret configuration; the start script above runs a standalone Node server.

Conclusion

You've encrypted your secrets, shared access with Armor, and loaded production secrets in SvelteKit with an Enclaved Key. Your secrets now travel with your code.