Vite i18n · React and Solid
Add Palamedes beside your renderer plugin and keep translation authoring inside TypeScript. The Vite adapter transforms macros, compiles imported PO catalogs, and reports catalog problems during development and production builds.
One transform and catalog loader for Vite projects.
Choose the runtime module that matches the UI.
The current matrix itself runs on Vite 8.
PO imports today; PO or FCL for CLI catalog storage.
@palamedes/vite-pluginv1.17.32.4K downloads / month01 — The framework problem
A useful Vite i18n setup still needs an authoring model, extraction, catalogs, ICU validation, renderer integration, and an active runtime. Adding unrelated plugins for each step creates boundaries that fail at different times.
02 — The Palamedes model
The plugin is only the build boundary. Palamedes connects it to the same native transform, catalog engine, runtime contract, and CLI used by the framework adapters.
Place palamedes() before the React plugin, or add it to SolidStart's Vite configuration with the Solid runtime module.
@palamedes/react and @palamedes/solid expose renderer-specific macros and client helpers over the same catalog semantics.
The native pmds CLI extracts and updates catalogs explicitly, while Vite focuses on turning application modules into runnable code.
03 — In TypeScript
vite.config.ts
// React
import react from "@vitejs/plugin-react"
import { palamedes } from "@palamedes/vite-plugin"
import { defineConfig } from "vite"
export default defineConfig({
plugins: [
palamedes(),
react(),
],
})
// Solid
import solid from "vite-plugin-solid"
export default defineConfig({
plugins: [
palamedes({ framework: "solid" }),
solid(),
],
})Both paths use TypeScript macros, the same palamedes.yaml format, and the same extraction CLI. The renderer package supplies rich-message and client-locale primitives where the UI models differ.
04 — Locale strategy
Vite does not prescribe routing or server request APIs. Cookie, route, subdomain, and top-level-domain locale policies remain application concerns; Palamedes keeps the translation pipeline stable underneath whichever policy your React or Solid host implements.
One URL for all locales. Best for apps behind login where SEO is irrelevant and switching should be instant.
/de/checkout-style paths. The SEO-friendly default for public content with indexable localized pages.
de.example.com. Clean separation per market, works well with regional CDNs and analytics splits.
example.de vs example.com. Maximum market trust; Palamedes maps each domain to its locale.
05 — Proof and boundaries
TanStack Start, SolidStart, Waku, and React Router use @palamedes/vite-plugin throughout the browser-verified framework matrix. Package tests cover the transform and loader boundary directly.
TanStack Start, Waku, and React Router.
SolidStart uses the Solid runtime integration.
The same plugin handles transforms and PO imports.
Macro, placeholder, and ICU problems surface early.
06 — Questions
The short version of the decisions that usually block an implementation.
07 — Keep exploring