diff --git a/docs/en-US/react/nextjs-pages-router-quickstart.mdx b/docs/en-US/react/nextjs-pages-router-quickstart.mdx index b8881c9b1..f99ca248e 100644 --- a/docs/en-US/react/nextjs-pages-router-quickstart.mdx +++ b/docs/en-US/react/nextjs-pages-router-quickstart.mdx @@ -117,6 +117,10 @@ export default async function loadTranslations(locale: string) { } ``` + + **Note:** These translation files do not exist until you create them with `npx gt generate` (no API key needed) or `npx gt translate` (with credentials). Until then the bundler warns about the missing `public/_gt` directory, and the `try`/`catch` above returns `{}` so the app still runs with untranslated content. + + `withGTConfig` automatically detects a `loadTranslations.[js|ts]` file in your project root or `src/` directory — no additional configuration needed. diff --git a/docs/en-US/react/nextjs-quickstart.mdx b/docs/en-US/react/nextjs-quickstart.mdx index 623530656..264281551 100644 --- a/docs/en-US/react/nextjs-quickstart.mdx +++ b/docs/en-US/react/nextjs-quickstart.mdx @@ -113,6 +113,10 @@ export default async function loadTranslations(locale: string) { } ``` + + **Warning:** These translation files do not exist until you create them, so the first `npm run dev` fails to compile and the page returns HTTP 500. Run `npx gt generate` (no API key needed) or `npx gt translate` (with credentials), or add empty `{}` files at `public/_gt/[locale].json`. + + `withGTConfig` automatically detects a `loadTranslations.[js|ts]` file in your `src/` directory or project root — no additional configuration needed. diff --git a/docs/en-US/react/react-native-quickstart.mdx b/docs/en-US/react/react-native-quickstart.mdx index 464d6b02f..c1dbf0809 100644 --- a/docs/en-US/react/react-native-quickstart.mdx +++ b/docs/en-US/react/react-native-quickstart.mdx @@ -145,6 +145,10 @@ export function loadTranslations(locale: string) { The CLI generates these files when you run `npx gt translate`. + + **Warning:** These files do not exist until you create them, and Metro will not bundle your app until they do. Run `npx gt generate` (no API key needed) or `npx gt translate` (with credentials) before starting the app. + + ### 5. Initialize General Translation and add the provider Call [`initializeGT`](/docs/node/reference/functions/initialize-gt) once at your app's entry point, before rendering, then wrap your app in `GTProvider`. Unlike the web packages, `GTProvider` loads translations internally, so you do not pass a `translations` prop and normally do not need to pass `locale` either — it is auto-detected. An optional `locale` prop is still accepted if you need to override detection. diff --git a/docs/en-US/react/tanstack-start-quickstart.mdx b/docs/en-US/react/tanstack-start-quickstart.mdx index bcb1a5dfe..13399a214 100644 --- a/docs/en-US/react/tanstack-start-quickstart.mdx +++ b/docs/en-US/react/tanstack-start-quickstart.mdx @@ -139,6 +139,10 @@ function RootDocument({ children }: { children: React.ReactNode }) { `parseLocale` reads the locale from the request cookie and headers on the server, and from the cookie in the browser. `GTProvider` requires both `locale` and `translations`. + + **Warning:** These translation files (`src/_gt/[locale].json`) do not exist until you create them. The default locale still renders, but selecting a target locale in the language switcher returns HTTP 500 until the files exist. Run `npx gt generate` (no API key needed) or `npx gt translate` (with credentials) to create them first. + + ### 5. Mark content for translation Wrap JSX in the `` component to translate it in place. Import `` and [`useGT`](/docs/react/reference/hooks/use-gt) from `gt-react` so the CLI detects them when scanning your source.