一键导入
lingui-i18n
The full lingui i18n workflow (setup / extract / translate / compile / adding a locale), with runnable scripts and ICU examples
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
The full lingui i18n workflow (setup / extract / translate / compile / adding a locale), with runnable scripts and ICU examples
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | lingui-i18n |
| description | The full lingui i18n workflow (setup / extract / translate / compile / adding a locale), with runnable scripts and ICU examples |
| when_to_use | Adding or changing UI copy, adding a language, setting up lingui, catalogs out of sync, or an i18n check failing in CI |
| allowed-tools | ["Read","Edit","Write","Bash","Glob","Grep"] |
| metadata | {"category":"i18n","stack":"lingui"} |
XID localizes everything through lingui: the React SPA (apps/server/src, TanStack Router) covering the Hosted UI and the org and platform consoles, the React SDK (packages/react), and user-facing Worker API errors. The standing coding conventions live in the i18n-lingui rule; this skill is the operational procedure. Email templates are out of scope (Mustache + R2, see chapter 07). The contributor-facing summary is docs/i18n.md.
lingui v6 (6.2.0) dependencies are split across three places:
# repo root
pnpm add -D -w @lingui/cli @lingui/conf @lingui/format-po
# apps/server
pnpm --filter @xid-kit/server add @lingui/core @lingui/react
pnpm --filter @xid-kit/server add -D @lingui/vite-plugin @lingui/babel-plugin-lingui-macro @rolldown/plugin-babel
lingui.config.ts sits at the repo root (see the i18n-lingui rule for the exact config block): sourceLocale: 'en', compileNamespace: 'es', catalog path packages/i18n/locales/{locale}/messages, po formatter with lineNumbers: false.
apps/server/vite.config.ts enables the macro transform with lingui() plus babel({ presets: [linguiTransformerBabelPreset()] }).
Follow the i18n-lingui rule:
<Trans> for JSX, t for imperative strings, plural for counts, msg for lazy messages. Do not hand-write ids.packages/react): no macros. Add a descriptor to sdkMessages in packages/react/src/i18n-runtime.tsx with an explicit sdk.* id and the /*i18n*/ marker comment, then render it with Rt (JSX) or rt(translate, descriptor) (string).ICU usage: references/icu-examples.md. Catalog layout and naming: references/catalog-conventions.md.
bash .stdai/standards/skills/lingui-i18n/scripts/extract.sh
Equivalent to lingui extract --overwrite. Pulls macro and descriptor messages from the source into each locale's .po. New messages are filled in automatically for the source locale and left empty in the others. Check the Missing and Total counts in the output.
Edit packages/i18n/locales/<locale>/messages.po and fill in msgstr. ICU placeholders ({name}, {count, plural, ...}) MUST stay identical. Machine translation is acceptable as a starting point, but the source locale (en) requires human review.
bash .stdai/standards/skills/lingui-i18n/scripts/compile.sh
Equivalent to lingui compile. Turns each .po into the messages.mjs artifact the runtime imports. The runtime imports the compiled artifact, never the .po. Compiled artifacts are committed and MUST stay fresh.
A new locale has to be registered in every one of these places, or it will half-work:
lingui.config.ts -- add the BCP 47 tag (for example it, zh-Hant) to locales.packages/i18n/src/i18n.ts -- SUPPORTED_LOCALES.apps/server/src/lib/locale.ts -- SUPPORTED_LOCALES and the CATALOG_LOADERS dynamic-import map.apps/server/worker/lib/locale.ts -- SUPPORTED_LOCALES; and apps/server/worker/middleware/i18n.ts -- CATALOG_LOADERS.apps/server/src/components/LanguageSwitcher.tsx -- LOCALE_LABELS (native-language label).packages/i18n/src/catalog.test.ts -- the LOCALES list checked by the audit gate.Then run extract (creates the directory and empty .po), translate, compile, and run pnpm run i18n:audit.
pnpm run i18n:audit # vitest gate: no bypassed UI copy, no untranslated catalog entries
pnpm run i18n:runtime # real-browser check of html lang, catalog loading and page copy
pnpm exec lingui compile --strict # fail on missing translations
pnpm check already includes pnpm run i18n:audit, and CI runs pnpm check. lingui v6 has no --fail-on-warning flag on extract -- do not put it in a script, the CLI rejects it.
Before opening a PR: no bypassed copy, catalogs complete, compiled artifacts in sync with the source (git diff clean after a fresh compile).
pnpm run i18n:audit passes).po has the entrymessages.mjs regenerated and committed?locale= -> user.locale -> Accept-Language -> tenant default -> en on the Worker side)One-shot lingui extract + compile to resync the locale catalogs (Invoke when user types /i18n-sync or asks to run i18n-sync)
Design execution rules for building or reworking XID front-end surfaces (Hosted UI / console / landing / SDK components) -- produce non-templated interfaces inside the existing --xid-* design system and avoid recognizable AI-default patterns Creating a page or component, reworking a layout, writing UI copy, or when a reviewer says the interface "looks AI-generated" or "too templated"
The full lingui i18n workflow (setup / extract / translate / compile / adding a locale), with runnable scripts and ICU examples Adding or changing UI copy, adding a language, setting up lingui, catalogs out of sync, or an i18n check failing in CI
Complete execution rules for detail and motion polish on XID interfaces. Covers twelve dimensions -- alignment, spacing, typography, color contrast, interaction states, micro-interactions, motion choreography, copy, edge states, responsiveness, performance, code -- split into a brand register (landing) and a product register (Hosted UI / account / console / docs) A reviewer says the details are unfinished, final polish before shipping, filling in missing interaction states, adding or tuning motion, fixing alignment and spacing, or the last quality pass before release
Design execution rules for building or reworking XID front-end surfaces (Hosted UI / console / landing / SDK components) -- produce non-templated interfaces inside the existing --xid-* design system and avoid recognizable AI-default patterns
Complete execution rules for detail and motion polish on XID interfaces. Covers twelve dimensions -- alignment, spacing, typography, color contrast, interaction states, micro-interactions, motion choreography, copy, edge states, responsiveness, performance, code -- split into a brand register (landing) and a product register (Hosted UI / account / console / docs)