use loadenv

Author: wobsoriano

packages/astro/package.json

@@ -96,7 +96,8 @@
   },
   "devDependencies": {
     "@clerk/ui": "workspace:^",
-    "astro": "^5.15.9"
+    "astro": "^5.15.9",
+    "vite": "^7.1.0"
   },
   "peerDependencies": {
     "astro": "^4.15.0 || ^5.0.0"

packages/astro/src/integration/create-integration.ts

@@ -1,6 +1,7 @@
 import type { ClerkOptions } from '@clerk/shared/types';
 import type { AstroIntegration } from 'astro';
 import { envField } from 'astro/config';
+import { loadEnv } from 'vite';
 
 import { name as packageName, version as packageVersion } from '../../package.json';
 import { resolveKeysWithKeylessFallback } from '../server/keyless/utils';
@@ -32,10 +33,24 @@ function createIntegration<Params extends HotloadAstroClerkIntegrationParams>()
             logger.error('Missing adapter, please update your Astro config to use one.');
           }
 
-          const envPublishableKey = process.env.PUBLIC_CLERK_PUBLISHABLE_KEY;
-          const envSecretKey = process.env.CLERK_SECRET_KEY;
-
           const isDev = command === 'dev';
+
+          // Load environment variables from .env files
+          // Astro's integration hook runs before .env is loaded, so we need to do it manually
+          const mode = isDev ? 'development' : 'production';
+          const envDir = config.root.pathname;
+          const loadedEnv = loadEnv(mode, envDir, '');
+
+          console.log('[Integration Debug] Loaded env from .env files:', {
+            PUBLIC_CLERK_PUBLISHABLE_KEY: loadedEnv.PUBLIC_CLERK_PUBLISHABLE_KEY?.substring(0, 20) + '...',
+            CLERK_SECRET_KEY: loadedEnv.CLERK_SECRET_KEY?.substring(0, 20) + '...',
+            allClerkKeys: Object.keys(loadedEnv).filter(k => k.includes('CLERK')),
+          });
+
+          // Try .env files first, then fall back to process.env
+          const envPublishableKey = loadedEnv.PUBLIC_CLERK_PUBLISHABLE_KEY || process.env.PUBLIC_CLERK_PUBLISHABLE_KEY;
+          const envSecretKey = loadedEnv.CLERK_SECRET_KEY || process.env.CLERK_SECRET_KEY;
+
           let resolvedKeys = {
             publishableKey: envPublishableKey,
             secretKey: envSecretKey,

packages/astro/tsup.config.ts

@@ -26,6 +26,14 @@ export default defineConfig(() => {
     bundle: true,
     sourcemap: true,
     format: ['esm'],
-    external: ['astro', 'react', 'react-dom', 'node:async_hooks', '#async-local-storage', 'astro:transitions/client'],
+    external: [
+      'astro',
+      'react',
+      'react-dom',
+      'node:async_hooks',
+      '#async-local-storage',
+      'astro:transitions/client',
+      'vite',
+    ],
   };
 });