TanStackT
TanStack12mo ago
10 replies
dual-salmon

How to Make ENV Accessible in a TanStack Start Server Build?

I'm using the Clerk example: Clerk Basic Example

Environment Variables

I have the following in my
.env
:
CLERK_PUBLISHABLE_KEY=123
VITE_CLERK_PUBLISHABLE_KEY=123
NITRO_CLERK_PUBLISHABLE_KEY=123

CLERK_SECRET_KEY=1234
VITE_CLERK_SECRET_KEY=1234
NITRO_CLERK_SECRET_KEY=1234


App Config

My app.config.ts uses the node-server preset since I plan to host on AWS Lightsail:
import { defineConfig } from "@tanstack/start/config";
import tsConfigPaths from "vite-tsconfig-paths";

export default defineConfig({
  vite: {
    plugins: [
      tsConfigPaths({
        projects: ["./tsconfig.json"],
      }),
    ],
  },

  server: {
    preset: "node-server",
  },
});


Debugging Logs

After running the build, in my __root.tsx I added:
console.log(import.meta.env);
console.log(process.env);


- Result: Only VITE_CLERK_* variables are visible in both logs during the build.

Server Function

Here’s the function that calls Clerk auth:
const fetchClerkAuth = createServerFn({ method: "GET" }).handler(async () => {
  const { userId, sessionClaims } = await getAuth(getWebRequest());

  return {
    id: userId,
    dbId: sessionClaims?.metadata.db_user_id,
  };
});


- Error:
Server Fn Error!
Error: @clerk/tanstack-start: Clerk: no secret key provided

[nitro] [request error] [unhandled] @clerk/tanstack-start: Clerk: no secret key provided


My Question

How do I make the server see CLERK_SECRET_KEY in the built version?
Was this page helpful?