3 files changed, 40 insertions, 0 deletions
diff --git a/examples/env-vars/src/env.d.ts b/examples/env-vars/src/env.d.ts
new file mode 100644
index 000000000..a1befd0f0
--- /dev/null
+++ b/examples/env-vars/src/env.d.ts
@@ -0,0 +1,10 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+  readonly DB_PASSWORD: string;
+	readonly PUBLIC_SOME_KEY: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}
diff --git a/examples/env-vars/src/pages/index.astro b/examples/env-vars/src/pages/index.astro
new file mode 100644
index 000000000..0d19b9a46
--- /dev/null
+++ b/examples/env-vars/src/pages/index.astro
@@ -0,0 +1,21 @@
+---
+const { SSR, DB_PASSWORD, PUBLIC_SOME_KEY } = import.meta.env;
+
+// DB_PASSWORD is available because we're running on the server
+console.log({ SSR, DB_PASSWORD });
+
+// PUBLIC_SOME_KEY is available everywhere
+console.log({ SSR, PUBLIC_SOME_KEY });
+---
+
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width" />
+		<title>Astro</title>
+	</head>
+	<body>
+		<h1>Hello, Environment Variables!</h1>
+		<script type="module" src="/src/scripts/client.ts"></script>
+	</body>
+</html>
diff --git a/examples/env-vars/src/scripts/client.ts b/examples/env-vars/src/scripts/client.ts
new file mode 100644
index 000000000..05961d399
--- /dev/null
+++ b/examples/env-vars/src/scripts/client.ts
@@ -0,0 +1,9 @@
+(() => {
+	const { SSR, DB_PASSWORD, PUBLIC_SOME_KEY } = import.meta.env;
+
+	// DB_PASSWORD is NOT available because we're running on the client
+	console.log({ SSR, DB_PASSWORD });
+
+	// PUBLIC_SOME_KEY is available everywhere
+	console.log({ SSR, PUBLIC_SOME_KEY });
+})()