Files
simple-react-app-kit/packages/i18n/docs/en-US/guide/setup.mdx
T

49 lines
1.4 KiB
Plaintext

---
title: Project setup
description: Create the application configuration and mount the Vite integration.
order: 10
toc:
- id: configuration
title: Configuration
- id: catalog-sources
title: Catalog sources
- id: vite-plugin
title: Vite plugin
---
## Configuration {#configuration}
Create `i18n.config.json` in the consuming application:
```json
{
"sourceLocale": "en-US",
"locales": ["en-US", "zh-Hans"],
"catalogPath": "src/locales/{locale}/messages",
"catalogSources": ["@workspace/ui/locales/{locale}"],
"include": ["src", "../../packages/ui/src"],
"exclude": ["**/*.test.{ts,tsx}"]
}
```
This file is the application's single persistent internationalization configuration. CLI commands create temporary Lingui configuration only for the child process.
The workspace ships exactly two locales: American English (`en-US`) and Simplified Chinese (`zh-Hans`). Use those same locale keys for application catalogs and package catalog sources.
## Catalog sources {#catalog-sources}
Sources are merged from left to right, and the application catalog is always last. Put reusable package catalogs first so product-specific translations can override them.
## Vite plugin {#vite-plugin}
```ts
import { i18n } from "@workspace/i18n/vite"
import { defineConfig } from "vite"
export default defineConfig({
plugins: [i18n()],
})
```
The plugin serves development catalog APIs and exposes the generated loader through `@workspace/i18n/catalogs`.