feat(react): Add env variable fallback for publishableKey in Vite apps #7634

brkalow · 2026-01-21T17:50:07Z

Summary

Adds automatic fallback to VITE_CLERK_PUBLISHABLE_KEY and CLERK_PUBLISHABLE_KEY environment variables when publishableKey is not explicitly provided to ClerkProvider
Enables Vite users to configure their publishable key via environment variables without manual configuration
Only triggers fallback when publishableKey is undefined (not empty string) to maintain compatibility with framework SDKs like Next.js

Closes AIE-431

Test plan

Added unit tests for getPublishableKeyFromEnv utility function
Added unit tests for getOrCreateInstance env var fallback behavior
Tests cover priority order: explicit prop > VITE_ prefixed > unprefixed
Tests verify empty string does not trigger fallback (framework SDK compatibility)

🤖 Generated with Claude Code

Summary by CodeRabbit

New Features
- ClerkProvider now automatically retrieves your publishableKey from environment variables (VITE_CLERK_PUBLISHABLE_KEY or CLERK_PUBLISHABLE_KEY) when not explicitly provided, streamlining setup and configuration.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

When publishableKey is not explicitly provided, the React SDK now checks for VITE_CLERK_PUBLISHABLE_KEY and CLERK_PUBLISHABLE_KEY environment variables. This enables Vite users to set their publishable key via environment variables without manual configuration. The fallback only triggers when publishableKey is undefined (not when it's an empty string) to avoid conflicting with framework SDKs like Next.js that may pass empty string when their env var is not set. Closes AIE-431 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

changeset-bot · 2026-01-21T17:50:12Z

🦋 Changeset detected

Latest commit: 00dc058

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 6 packages

Name	Type
@clerk/react	Minor
@clerk/chrome-extension	Patch
@clerk/expo	Patch
@clerk/nextjs	Patch
@clerk/react-router	Patch
@clerk/tanstack-react-start	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

vercel · 2026-01-21T17:50:12Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	Jan 22, 2026 3:37am

coderabbitai · 2026-01-21T17:53:30Z

📝 Walkthrough

Walkthrough

The PR implements automatic environment variable fallback for the publishableKey in the Clerk React SDK. A new utility module is introduced that handles merging of options with environment variables, checking VITE_CLERK_PUBLISHABLE_KEY first, then CLERK_PUBLISHABLE_KEY. The ClerkContextProvider is updated to use this merging function. Comprehensive tests validate the fallback behavior and precedence rules, including scenarios where explicit options override environment variables and where empty strings are preserved. Integration template examples are simplified by removing explicit publishableKey props, relying instead on automatic detection.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main change: adding environment variable fallback for publishableKey in Vite applications.
Linked Issues check	✅ Passed	The pull request fully addresses AIE-431 by detecting Vite env vars (VITE_CLERK_PUBLISHABLE_KEY) and CLERK_PUBLISHABLE_KEY as fallback when publishableKey is not explicitly provided.
Out of Scope Changes check	✅ Passed	All changes are in scope. The PR adds env variable fallback logic, utility functions, tests, and updates template examples. One minor observation: URL fallbacks (signInUrl, signUpUrl, etc.) were intentionally excluded for `@clerk/react-router` compatibility.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

pkg-pr-new · 2026-01-21T17:53:46Z

Open in StackBlitz

@clerk/agent-toolkit

npm i https://pkg.pr.new/@clerk/agent-toolkit@7634

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@7634

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@7634

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@7634

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@7634

@clerk/dev-cli

npm i https://pkg.pr.new/@clerk/dev-cli@7634

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@7634

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@7634

@clerk/express

npm i https://pkg.pr.new/@clerk/express@7634

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@7634

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@7634

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@7634

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@7634

@clerk/react

npm i https://pkg.pr.new/@clerk/react@7634

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@7634

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@7634

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@7634

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@7634

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@7634

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@7634

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@7634

commit: 00dc058

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

jacekradko

👍🏼

Extend the env var fallback support to include: - signInUrl (VITE_CLERK_SIGN_IN_URL / CLERK_SIGN_IN_URL) - signUpUrl (VITE_CLERK_SIGN_UP_URL / CLERK_SIGN_UP_URL) - signInForceRedirectUrl - signUpForceRedirectUrl - signInFallbackRedirectUrl - signUpFallbackRedirectUrl This brings the React SDK closer to parity with the Next.js SDK for Vite users who want to configure Clerk via environment variables. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

…elper Replace multiple individual env var getter functions with a single mergeWithEnv helper that handles all env var fallbacks in one place. This simplifies the isomorphicClerk code and mirrors the pattern used in the Next.js SDK with mergeNextClerkPropsWithEnv. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

…ntextProvider Move the mergeWithEnv call from IsomorphicClerk.getOrCreateInstance to ClerkContextProvider, where the options enter the public API. This: - Follows the same pattern as Next.js SDK (mergeNextClerkPropsWithEnv) - Keeps IsomorphicClerk focused on initialization, not configuration resolution - Makes the env var handling visible at the API boundary - Maintains clearer separation of concerns Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

Move mergeWithEnv tests to dedicated file at src/utils/__tests__/envVariables.test.ts, keeping isomorphicClerk.test.ts focused on IsomorphicClerk-specific behavior. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

…lback Remove explicit publishableKey props from ClerkProvider in react-vite and custom-flows-react-vite templates since ClerkProvider now automatically reads from VITE_CLERK_PUBLISHABLE_KEY env var. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

When environment variables are not set, return undefined instead of empty string. This prevents overriding downstream defaults (like those in @clerk/react-router) with empty strings, which can cause different behavior than undefined. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

…ibrary mode URL environment variable fallbacks (signInUrl, signUpUrl, etc.) were causing compatibility issues with @clerk/react-router in library mode. Only publishableKey env var fallback is now supported. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

github-actions bot added react core-3 labels Jan 21, 2026

vercel bot deployed to Preview January 21, 2026 17:50 View deployment

chore: Add changeset for Vite env fallback feature

568e199

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

vercel bot deployed to Preview January 21, 2026 18:04 View deployment

jacekradko approved these changes Jan 21, 2026

View reviewed changes

vercel bot deployed to Preview January 21, 2026 23:10 View deployment

vercel bot deployed to Preview January 21, 2026 23:13 View deployment

vercel bot deployed to Preview January 21, 2026 23:18 View deployment

test(react): Reorganize tests for env var handling

336a42b

Move mergeWithEnv tests to dedicated file at src/utils/__tests__/envVariables.test.ts, keeping isomorphicClerk.test.ts focused on IsomorphicClerk-specific behavior. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

vercel bot deployed to Preview January 21, 2026 23:23 View deployment

github-actions bot added the integration label Jan 21, 2026

vercel bot deployed to Preview January 21, 2026 23:27 View deployment

brkalow force-pushed the brkalow/vite-env-fallback branch from 586ae45 to 9efdf64 Compare January 22, 2026 02:55

vercel bot deployed to Preview January 22, 2026 02:56 View deployment

brkalow force-pushed the brkalow/vite-env-fallback branch from 9efdf64 to fa60cc1 Compare January 22, 2026 02:57

vercel bot deployed to Preview January 22, 2026 02:57 View deployment

brkalow and others added 2 commits January 21, 2026 21:19

vercel bot deployed to Preview January 22, 2026 03:37 View deployment

thiskevinwang approved these changes Jan 22, 2026

View reviewed changes

brkalow merged commit c77ca7e into main Jan 22, 2026
40 checks passed

brkalow deleted the brkalow/vite-env-fallback branch January 22, 2026 19:29

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(react): Add env variable fallback for publishableKey in Vite apps #7634

feat(react): Add env variable fallback for publishableKey in Vite apps #7634

brkalow commented Jan 21, 2026 •

edited by coderabbitai bot

Loading

Uh oh!

changeset-bot bot commented Jan 21, 2026 •

edited

Loading

Uh oh!

vercel bot commented Jan 21, 2026 •

edited

Loading

Uh oh!

coderabbitai bot commented Jan 21, 2026 •

edited

Loading

Walkthrough

Uh oh!

pkg-pr-new bot commented Jan 21, 2026 •

edited

Loading

Uh oh!

jacekradko left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

feat(react): Add env variable fallback for publishableKey in Vite apps #7634

feat(react): Add env variable fallback for publishableKey in Vite apps #7634

Conversation

brkalow commented Jan 21, 2026 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Test plan

Summary by CodeRabbit

Uh oh!

changeset-bot bot commented Jan 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

vercel bot commented Jan 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai bot commented Jan 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Uh oh!

pkg-pr-new bot commented Jan 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jacekradko left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

brkalow commented Jan 21, 2026 •

edited by coderabbitai bot

Loading

changeset-bot bot commented Jan 21, 2026 •

edited

Loading

vercel bot commented Jan 21, 2026 •

edited

Loading

coderabbitai bot commented Jan 21, 2026 •

edited

Loading

pkg-pr-new bot commented Jan 21, 2026 •

edited

Loading