> ## Documentation Index > Fetch the complete documentation index at: https://docs.replo.app/llms.txt > Use this file to discover all available pages before exploring further. # Setup > Wire the Replo provider, script injection, and Next.js config into a site. Every Replo site mounts these once, in `app/layout.tsx` and `next.config.ts`. They are the most-imported modules in the SDK. ## `providers/replo-provider` `@replohq/sdk/providers/replo-provider` #### `ReploProvider` Root provider for a Replo site. Mount it once in `app/layout.tsx`, wrapping the whole app. It sets up the React Query client every data loader reads from, the analytics layer, and cart state, so `useCart`, `useAnalytics`, and the loader components only work beneath it. ```ts theme={null} import { ReploProvider } from "@replohq/sdk/providers/replo-provider"; ``` ```ts theme={null} ReploProvider: ({ children }: React.PropsWithChildren) => Promise ``` ```tsx theme={null} export default function RootLayout({ children }: React.PropsWithChildren) { return ( {children} ); } ``` ## `next/config` `@replohq/sdk/next/config` #### `siteConfig` Builds the site's `next.config.ts`, layering your options over Replo's platform defaults (image loader, preview origins, build settings). Add keys freely: nested blocks are deep-merged, and platform wiring always wins, so setting one nested option never drops the rest of the block. Export the result as the default from `next.config.ts`. A site that needs no customization can re-export this module's own default instead. ```ts theme={null} import { siteConfig } from "@replohq/sdk/next/config"; ``` ```ts theme={null} siteConfig: (overrides?: NextConfig) => NextConfig ``` | Parameter | Description | | ----------- | ------------------------------------------------------- | | `overrides` | Next.js config options to layer on top of the defaults. | **Returns:** The merged Next.js config. ```ts theme={null} import { siteConfig } from "@replohq/sdk/next/config"; export default siteConfig({ experimental: { typedRoutes: true } }); ``` **Also exported** | Export | Kind | Type | | --------- | ----- | ------------ | | `default` | const | `NextConfig` | ## `next/image-loader` `@replohq/sdk/next/image-loader` **Exports** | Export | Kind | Type | | --------- | -------- | -------------------------------------------------------- | | `default` | function | `({ src, width, quality, }: ImageLoaderProps) => string` | ## `next/open-next` `@replohq/sdk/next/open-next` **Exports** | Export | Kind | Type | | --------- | ----- | ---------------- | | `default` | const | `OpenNextConfig` | ## `lib/buildMetadata` `@replohq/sdk/lib/buildMetadata` **Exports** | Export | Kind | Type | | ---------------- | ----- | -------------------------------------------------------------------------------------------------------------------- | | `BUILD_METADATA` | const | `{ packageName: string; version: string; branch: string \| null; commit: string \| null; builtAt: string \| null; }` |