Skip to main content
Docs

<ClerkLoaded>

The <ClerkLoaded> component guarantees that the Clerk object has loaded and will be available under window.Clerk. This allows you to wrap child components to access the Clerk object without the need to check it exists.

Example

It's not recommended to wrap the entire app in the <ClerkLoaded> component; instead, only wrap the components that need access to the Clerk object.

Note

Unlike other Clerk components for Astro, <ClerkLoaded> must be imported from @clerk/astro/react. This requires that your Astro app is set up with React. See Use Clerk with Astro and React for guidance.

index.astro
---
import { ClerkLoaded } from '@clerk/astro/react'
---

<ClerkLoaded client:load>
  <p>Clerk has loaded</p>
</ClerkLoaded>

Feedback

What did you think of this content?

Last updated on