@intlayer/docs 9.2.0 → 9.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (233) hide show
  1. package/README.md +24 -24
  2. package/blog/ar/index.md +1 -1
  3. package/blog/ar/rag_powered_documentation_assistant.md +1 -1
  4. package/blog/de/index.md +1 -1
  5. package/blog/en/index.md +1 -1
  6. package/blog/en-GB/index.md +1 -1
  7. package/blog/es/index.md +1 -1
  8. package/blog/fr/index.md +1 -1
  9. package/blog/hi/index.md +1 -1
  10. package/blog/id/index.md +1 -1
  11. package/blog/it/index.md +1 -1
  12. package/blog/ja/index.md +1 -1
  13. package/blog/ko/index.md +1 -1
  14. package/blog/pl/index.md +1 -1
  15. package/blog/pl/rag_powered_documentation_assistant.md +1 -1
  16. package/blog/pt/index.md +1 -1
  17. package/blog/ru/index.md +1 -1
  18. package/blog/uk/index.md +1 -1
  19. package/blog/vi/index.md +1 -1
  20. package/blog/zh/index.md +1 -1
  21. package/dist/cjs/_virtual/_rolldown/runtime.cjs +1 -2
  22. package/dist/cjs/authors2.cjs +0 -1
  23. package/dist/cjs/common.cjs +24 -1
  24. package/dist/cjs/common.cjs.map +1 -1
  25. package/dist/cjs/generated/blog.entry.cjs +35 -6
  26. package/dist/cjs/generated/blog.entry.cjs.map +1 -1
  27. package/dist/cjs/generated/docs.entry.cjs +35 -6
  28. package/dist/cjs/generated/docs.entry.cjs.map +1 -1
  29. package/dist/cjs/generated/frequentQuestions.entry.cjs +35 -6
  30. package/dist/cjs/generated/frequentQuestions.entry.cjs.map +1 -1
  31. package/dist/cjs/generated/legal.entry.cjs +35 -6
  32. package/dist/cjs/generated/legal.entry.cjs.map +1 -1
  33. package/dist/esm/common.mjs +24 -1
  34. package/dist/esm/common.mjs.map +1 -1
  35. package/dist/esm/generated/blog.entry.mjs +35 -6
  36. package/dist/esm/generated/blog.entry.mjs.map +1 -1
  37. package/dist/esm/generated/docs.entry.mjs +35 -6
  38. package/dist/esm/generated/docs.entry.mjs.map +1 -1
  39. package/dist/esm/generated/frequentQuestions.entry.mjs +35 -6
  40. package/dist/esm/generated/frequentQuestions.entry.mjs.map +1 -1
  41. package/dist/esm/generated/legal.entry.mjs +35 -6
  42. package/dist/esm/generated/legal.entry.mjs.map +1 -1
  43. package/dist/types/common.d.ts.map +1 -1
  44. package/dist/types/generated/blog.entry.d.ts.map +1 -1
  45. package/dist/types/generated/docs.entry.d.ts.map +1 -1
  46. package/dist/types/generated/frequentQuestions.entry.d.ts.map +1 -1
  47. package/dist/types/generated/legal.entry.d.ts.map +1 -1
  48. package/docs/ar/bundle_optimization.md +58 -25
  49. package/docs/ar/configuration.md +10 -10
  50. package/docs/ar/interest_of_intlayer.md +24 -22
  51. package/docs/ar/intlayer_with_express.md +1 -1
  52. package/docs/ar/intlayer_with_svelte_kit.md +1 -1
  53. package/docs/ar/intlayer_with_tanstack+solid.md +5 -3
  54. package/docs/ar/intlayer_with_tanstack.md +5 -3
  55. package/docs/ar/live-sync.md +4 -0
  56. package/docs/ar/lsp.md +114 -175
  57. package/docs/ar/readme.md +25 -25
  58. package/docs/bn/bundle_optimization.md +58 -25
  59. package/docs/bn/configuration.md +10 -10
  60. package/docs/bn/interest_of_intlayer.md +24 -22
  61. package/docs/cs/bundle_optimization.md +58 -25
  62. package/docs/cs/configuration.md +10 -10
  63. package/docs/cs/interest_of_intlayer.md +24 -22
  64. package/docs/de/bundle_optimization.md +58 -25
  65. package/docs/de/configuration.md +10 -10
  66. package/docs/de/interest_of_intlayer.md +24 -22
  67. package/docs/de/intlayer_with_svelte_kit.md +1 -1
  68. package/docs/de/intlayer_with_tanstack+solid.md +5 -3
  69. package/docs/de/intlayer_with_tanstack.md +5 -3
  70. package/docs/de/live-sync.md +4 -0
  71. package/docs/de/lsp.md +111 -172
  72. package/docs/de/readme.md +24 -24
  73. package/docs/en/bundle_optimization.md +51 -23
  74. package/docs/en/configuration.md +10 -10
  75. package/docs/en/interest_of_intlayer.md +24 -22
  76. package/docs/en/intlayer_with_svelte_kit.md +1 -1
  77. package/docs/en/intlayer_with_tanstack+solid.md +5 -3
  78. package/docs/en/intlayer_with_tanstack.md +5 -3
  79. package/docs/en/live-sync.md +4 -0
  80. package/docs/en/lsp.md +109 -170
  81. package/docs/en/readme.md +24 -24
  82. package/docs/en-GB/bundle_optimization.md +58 -25
  83. package/docs/en-GB/configuration.md +10 -10
  84. package/docs/en-GB/interest_of_intlayer.md +24 -22
  85. package/docs/en-GB/intlayer_with_svelte_kit.md +1 -1
  86. package/docs/en-GB/intlayer_with_tanstack+solid.md +5 -3
  87. package/docs/en-GB/intlayer_with_tanstack.md +5 -3
  88. package/docs/en-GB/live-sync.md +4 -0
  89. package/docs/en-GB/lsp.md +109 -170
  90. package/docs/en-GB/readme.md +24 -24
  91. package/docs/es/bundle_optimization.md +58 -25
  92. package/docs/es/configuration.md +10 -10
  93. package/docs/es/interest_of_intlayer.md +24 -22
  94. package/docs/es/intlayer_with_svelte_kit.md +1 -1
  95. package/docs/es/intlayer_with_tanstack+solid.md +5 -3
  96. package/docs/es/intlayer_with_tanstack.md +5 -3
  97. package/docs/es/live-sync.md +4 -0
  98. package/docs/es/lsp.md +114 -175
  99. package/docs/es/readme.md +24 -24
  100. package/docs/fr/bundle_optimization.md +58 -25
  101. package/docs/fr/configuration.md +10 -10
  102. package/docs/fr/interest_of_intlayer.md +24 -22
  103. package/docs/fr/intlayer_with_svelte_kit.md +1 -1
  104. package/docs/fr/intlayer_with_tanstack+solid.md +5 -3
  105. package/docs/fr/intlayer_with_tanstack.md +5 -3
  106. package/docs/fr/live-sync.md +4 -0
  107. package/docs/fr/lsp.md +110 -171
  108. package/docs/fr/readme.md +24 -24
  109. package/docs/hi/bundle_optimization.md +58 -25
  110. package/docs/hi/configuration.md +10 -10
  111. package/docs/hi/interest_of_intlayer.md +24 -22
  112. package/docs/hi/intlayer_with_express.md +1 -1
  113. package/docs/hi/intlayer_with_svelte_kit.md +1 -1
  114. package/docs/hi/intlayer_with_tanstack+solid.md +5 -3
  115. package/docs/hi/intlayer_with_tanstack.md +5 -3
  116. package/docs/hi/live-sync.md +4 -0
  117. package/docs/hi/lsp.md +113 -174
  118. package/docs/hi/readme.md +24 -24
  119. package/docs/id/bundle_optimization.md +58 -25
  120. package/docs/id/configuration.md +10 -10
  121. package/docs/id/interest_of_intlayer.md +24 -22
  122. package/docs/id/intlayer_with_svelte_kit.md +1 -1
  123. package/docs/id/intlayer_with_tanstack+solid.md +5 -3
  124. package/docs/id/intlayer_with_tanstack.md +5 -3
  125. package/docs/id/live-sync.md +4 -0
  126. package/docs/id/lsp.md +113 -174
  127. package/docs/id/readme.md +24 -24
  128. package/docs/it/bundle_optimization.md +58 -25
  129. package/docs/it/configuration.md +10 -10
  130. package/docs/it/interest_of_intlayer.md +24 -22
  131. package/docs/it/intlayer_with_svelte_kit.md +1 -1
  132. package/docs/it/intlayer_with_tanstack+solid.md +5 -3
  133. package/docs/it/intlayer_with_tanstack.md +5 -3
  134. package/docs/it/live-sync.md +4 -0
  135. package/docs/it/lsp.md +115 -176
  136. package/docs/it/readme.md +24 -24
  137. package/docs/ja/bundle_optimization.md +58 -25
  138. package/docs/ja/configuration.md +10 -10
  139. package/docs/ja/interest_of_intlayer.md +24 -22
  140. package/docs/ja/intlayer_with_tanstack+solid.md +5 -3
  141. package/docs/ja/intlayer_with_tanstack.md +5 -3
  142. package/docs/ja/live-sync.md +4 -0
  143. package/docs/ja/lsp.md +113 -174
  144. package/docs/ja/readme.md +24 -24
  145. package/docs/ko/bundle_optimization.md +58 -25
  146. package/docs/ko/configuration.md +10 -10
  147. package/docs/ko/interest_of_intlayer.md +24 -22
  148. package/docs/ko/intlayer_with_svelte_kit.md +1 -1
  149. package/docs/ko/intlayer_with_tanstack+solid.md +5 -3
  150. package/docs/ko/intlayer_with_tanstack.md +5 -3
  151. package/docs/ko/live-sync.md +4 -0
  152. package/docs/ko/lsp.md +112 -173
  153. package/docs/ko/readme.md +24 -24
  154. package/docs/nl/bundle_optimization.md +58 -25
  155. package/docs/nl/configuration.md +10 -10
  156. package/docs/nl/interest_of_intlayer.md +24 -22
  157. package/docs/pl/bundle_optimization.md +58 -25
  158. package/docs/pl/configuration.md +10 -10
  159. package/docs/pl/interest_of_intlayer.md +4 -2
  160. package/docs/pl/intlayer_with_svelte_kit.md +1 -1
  161. package/docs/pl/intlayer_with_tanstack+solid.md +5 -3
  162. package/docs/pl/intlayer_with_tanstack.md +5 -3
  163. package/docs/pl/live-sync.md +4 -0
  164. package/docs/pl/lsp.md +115 -176
  165. package/docs/pl/readme.md +24 -24
  166. package/docs/pt/bundle_optimization.md +58 -24
  167. package/docs/pt/configuration.md +10 -10
  168. package/docs/pt/interest_of_intlayer.md +24 -22
  169. package/docs/pt/intlayer_with_svelte_kit.md +1 -1
  170. package/docs/pt/intlayer_with_tanstack+solid.md +5 -3
  171. package/docs/pt/intlayer_with_tanstack.md +5 -3
  172. package/docs/pt/live-sync.md +4 -0
  173. package/docs/pt/lsp.md +113 -174
  174. package/docs/pt/readme.md +24 -24
  175. package/docs/ru/bundle_optimization.md +58 -25
  176. package/docs/ru/configuration.md +10 -10
  177. package/docs/ru/interest_of_intlayer.md +24 -22
  178. package/docs/ru/intlayer_with_nextjs_14.md +1 -1
  179. package/docs/ru/intlayer_with_nextjs_15.md +1 -1
  180. package/docs/ru/intlayer_with_svelte_kit.md +1 -1
  181. package/docs/ru/intlayer_with_tanstack+solid.md +5 -3
  182. package/docs/ru/intlayer_with_tanstack.md +5 -3
  183. package/docs/ru/live-sync.md +4 -0
  184. package/docs/ru/lsp.md +112 -173
  185. package/docs/ru/readme.md +24 -24
  186. package/docs/tr/bundle_optimization.md +58 -25
  187. package/docs/tr/configuration.md +10 -10
  188. package/docs/tr/interest_of_intlayer.md +24 -22
  189. package/docs/tr/intlayer_with_svelte_kit.md +1 -1
  190. package/docs/tr/intlayer_with_tanstack+solid.md +5 -3
  191. package/docs/tr/intlayer_with_tanstack.md +5 -3
  192. package/docs/tr/live-sync.md +4 -0
  193. package/docs/tr/lsp.md +113 -174
  194. package/docs/tr/readme.md +24 -24
  195. package/docs/uk/bundle_optimization.md +58 -25
  196. package/docs/uk/configuration.md +10 -10
  197. package/docs/uk/interest_of_intlayer.md +4 -2
  198. package/docs/uk/intlayer_with_svelte_kit.md +1 -1
  199. package/docs/uk/intlayer_with_tanstack+solid.md +5 -3
  200. package/docs/uk/intlayer_with_tanstack.md +5 -3
  201. package/docs/uk/live-sync.md +4 -0
  202. package/docs/uk/lsp.md +113 -174
  203. package/docs/uk/per_locale_file.md +1 -1
  204. package/docs/uk/readme.md +24 -24
  205. package/docs/ur/bundle_optimization.md +58 -25
  206. package/docs/ur/configuration.md +10 -10
  207. package/docs/ur/interest_of_intlayer.md +24 -22
  208. package/docs/vi/bundle_optimization.md +58 -25
  209. package/docs/vi/configuration.md +10 -10
  210. package/docs/vi/interest_of_intlayer.md +24 -22
  211. package/docs/vi/intlayer_with_svelte_kit.md +1 -1
  212. package/docs/vi/intlayer_with_tanstack+solid.md +5 -3
  213. package/docs/vi/intlayer_with_tanstack.md +5 -3
  214. package/docs/vi/live-sync.md +4 -0
  215. package/docs/vi/lsp.md +115 -176
  216. package/docs/vi/readme.md +24 -24
  217. package/docs/zh/bundle_optimization.md +58 -25
  218. package/docs/zh/configuration.md +10 -10
  219. package/docs/zh/interest_of_intlayer.md +24 -22
  220. package/docs/zh/intlayer_with_svelte_kit.md +1 -1
  221. package/docs/zh/intlayer_with_tanstack+solid.md +5 -3
  222. package/docs/zh/intlayer_with_tanstack.md +5 -3
  223. package/docs/zh/live-sync.md +4 -0
  224. package/docs/zh/lsp.md +113 -174
  225. package/docs/zh/readme.md +21 -21
  226. package/docs/zh-TW/bundle_optimization.md +58 -25
  227. package/docs/zh-TW/interest_of_intlayer.md +24 -22
  228. package/package.json +7 -7
  229. package/src/common.ts +39 -2
  230. package/src/generated/blog.entry.ts +39 -7
  231. package/src/generated/docs.entry.ts +39 -7
  232. package/src/generated/frequentQuestions.entry.ts +39 -7
  233. package/src/generated/legal.entry.ts +39 -7
@@ -1,6 +1,6 @@
1
1
  ---
2
2
  createdAt: 2025-11-25
3
- updatedAt: 2026-06-24
3
+ updatedAt: 2026-08-09
4
4
  title: Optimizing i18n Bundle Size & Performance
5
5
  description: Reduce application bundle size by optimizing internationalization (i18n) content. Learn how to leverage tree shaking and lazy loading for dictionaries with Intlayer.
6
6
  keywords:
@@ -16,6 +16,9 @@ slugs:
16
16
  - concept
17
17
  - bundle-optimization
18
18
  history:
19
+ - version: 9.2.1
20
+ date: 2026-08-09
21
+ changes: "`purge` and `minify` now work on Next.js through `@intlayer/swc` — no `babel.config.js` required"
19
22
  - version: 8.12.0
20
23
  date: 2026-06-24
21
24
  changes: "List Babel plugins in required pipeline order (extract → purge → minify → optimize) in the reference tables"
@@ -225,6 +228,20 @@ Vite users **never configure these directly**. They are wired up automatically w
225
228
  | Dictionary minify | Same as `intlayerMinifyBabelPlugin` JSON-write pass |
226
229
  | Babel transform | Same as `intlayerMinifyBabelPlugin` source-code rename + `intlayerOptimizeBabelPlugin` |
227
230
 
231
+ ### SWC plugin (`@intlayer/swc`)
232
+
233
+ Next.js users **never configure these directly** either. Since **v9.2.1**, `withIntlayer()` in `next.config.ts` runs the full pipeline — purge, minify and import rewriting — from the `build.purge` and `build.minify` flags alone.
234
+
235
+ The work is split in two, because an SWC Wasm plugin transforms one file at a time with no file-system access:
236
+
237
+ | Pass | Where it runs | What it does |
238
+ | :---------------------------------------- | :---------------------------- | :---------------------------------------------------------------------------------------- |
239
+ | Usage analysis + JSON purge/minify | Node, inside `withIntlayer()` | Reads every component source file, rewrites `.intlayer/**/*.json`, produces rename tables |
240
+ | Source rewriting (`content.title` → `.a`) | `@intlayer/swc` (Wasm) | Applies the rename tables to the matching property accesses in your code |
241
+ | Import rewriting (`useIntlayer` → dict) | `@intlayer/swc` (Wasm) | Same as `intlayerOptimizeBabelPlugin` |
242
+
243
+ Deciding _which_ fields are unused and _what_ alias each one gets requires cross-file state and file I/O, so that half runs in Node; the SWC plugin only receives the resulting tables.
244
+
228
245
  ## Setup by Platform
229
246
 
230
247
  <Tabs>
@@ -232,10 +249,12 @@ Vite users **never configure these directly**. They are wired up automatically w
232
249
 
233
250
  ### Next.js
234
251
 
235
- Next.js requires the `@intlayer/swc` plugin for the optimize (import rewriting) pass, because Next.js uses SWC for builds.
252
+ Next.js requires the `@intlayer/swc` plugin, because Next.js uses SWC for builds. Since **v9.2.1** this single package covers the whole pipeline — optimize (import rewriting), purge and minify.
236
253
 
237
254
  > This plugin is not installed by default because SWC plugins are still experimental for Next.js. It may change in the future.
238
255
 
256
+ > **Next.js 16.1.0 is the minimum version.** It is the first release built on SWC's forward-compatible Wasm plugin ABI; earlier releases reject the plugin. `withIntlayer` reads your Next.js version and simply does not register the plugin below 16.1.0 — those builds still succeed, they just run without bundle optimization.
257
+
239
258
  <Tabs>
240
259
  <Tab value="npm">
241
260
 
@@ -270,33 +289,40 @@ intlayer-swc-plugin = "*"
270
289
 
271
290
  Once installed, Intlayer will automatically detect and use the plugin.
272
291
 
273
- For the **purge and minify** passes (field removal and field renaming), install `@intlayer/babel` alongside and add the Babel plugins. Because Next.js uses SWC for transform but still evaluates `babel.config.js` for plugin configuration, the Babel plugins run as a pre-pass before SWC.
292
+ The **purge and minify** passes (field removal and field renaming) require no extra package and no `babel.config.js`. Wrap your config with `withIntlayer` and toggle the flags in `intlayer.config.ts`:
274
293
 
275
- ```bash packageManager="npm"
276
- npm install -D @intlayer/babel
294
+ ```typescript fileName="next.config.ts"
295
+ import { withIntlayer } from "next-intlayer/server";
296
+ import type { NextConfig } from "next";
297
+
298
+ const nextConfig: NextConfig = {/* your config */};
299
+
300
+ export default withIntlayer(nextConfig);
277
301
  ```
278
302
 
279
- ```javascript fileName="babel.config.js"
280
- const {
281
- intlayerPurgeBabelPlugin,
282
- intlayerMinifyBabelPlugin,
283
- getPurgePluginOptions,
284
- getMinifyPluginOptions,
285
- } = require("@intlayer/babel");
303
+ ```typescript fileName="intlayer.config.ts"
304
+ import type { IntlayerConfig } from "intlayer";
286
305
 
287
- module.exports = {
288
- presets: ["next/babel"],
289
- plugins: [
290
- // Purge: remove unused content fields from .intlayer/**/*.json
291
- [intlayerPurgeBabelPlugin, getPurgePluginOptions()],
292
- // Minify: rename content field keys in JSON + source code
293
- [intlayerMinifyBabelPlugin, getMinifyPluginOptions()],
294
- // Note: intlayerOptimizeBabelPlugin is NOT needed here because
295
- // @intlayer/swc handles the useIntlayer → useDictionary rewrite.
296
- ],
306
+ const config: IntlayerConfig = {
307
+ build: {
308
+ purge: true, // remove unused content fields from bundled JSON
309
+ minify: true, // rename content field keys to short aliases
310
+ },
297
311
  };
312
+
313
+ export default config;
298
314
  ```
299
315
 
316
+ During `next build`, `withIntlayer` analyzes your sources, rewrites the compiled dictionaries, and forwards the resulting field-rename tables to `@intlayer/swc`, which updates the matching property accesses in your code.
317
+
318
+ > Use the async `withIntlayer`, not `withIntlayerSync`. The sync variant does not run the analysis pipeline, so purge and minify have no effect with it.
319
+
320
+ > Purge and minify run on `next build` only — the optimize pipeline is off during `next dev`.
321
+
322
+ > They are also disabled when compat-adapter callers are configured (`swcExtraCallers`, set by the compat packages such as `@intlayer/next-intl` or `@intlayer/react-i18next`): those call sites are invisible to the usage analyzer, so purging would remove fields the code still reads. Import rewriting stays active.
323
+
324
+ **Earlier versions (before 9.2.1)** required `@intlayer/babel` and a `babel.config.js` declaring `intlayerPurgeBabelPlugin` and `intlayerMinifyBabelPlugin`. That file is no longer needed and can be deleted.
325
+
300
326
  </Tab>
301
327
  <Tab value="vite">
302
328
 
@@ -452,6 +478,8 @@ export default config;
452
478
 
453
479
  > Minification is skipped when `optimize` is `false` or when `editor.enabled` is `true` (the visual editor requires the original field names to allow editing).
454
480
 
481
+ > On Next.js, minification is also skipped when `@intlayer/swc` is not installed or cannot be loaded (Next.js below 16.1.0). The plugin is the half that rewrites the source accesses, so renaming the dictionaries without it would leave your code reading field names that no longer exist.
482
+
455
483
  > Minification is also skipped for dictionaries loaded via `importMode: 'fetch'` because their JSON is served from a remote API using the original field names — renaming the client-side keys would break the server/client contract.
456
484
 
457
485
  ### Purging (unused field removal)
@@ -480,7 +508,7 @@ export default config;
480
508
  { "title": "…", "subtitle": "…" }
481
509
  ```
482
510
 
483
- > Purge is skipped when `optimize` is `false` or when `editor.enabled` is `true`.
511
+ > Purge is skipped when `optimize` is `false` or when `editor.enabled` is `true`. On Next.js it is additionally skipped when `@intlayer/swc` is unavailable, and when compat-adapter callers are configured.
484
512
 
485
513
  > Purge is also skipped conservatively when a source file cannot be parsed, or when the result of `useIntlayer` is assigned to a variable and passed around in ways the static analyser cannot follow (e.g. spread into an object, passed as a prop without destructuring). In those cases the full dictionary is kept.
486
514
 
@@ -407,7 +407,7 @@ const config: IntlayerConfig = {
407
407
  ai: {
408
408
  /**
409
409
  * AI provider to use.
410
- * Options: 'openai', 'anthropic', 'mistral', 'deepseek', 'gemini', 'ollama', 'openrouter', 'alibaba', 'fireworks', 'groq', 'huggingface', 'bedrock', 'googlevertex', 'togetherai', 'lmstudio'
410
+ * Options: 'openai', 'anthropic', 'mistral', 'deepseek', 'gemini', 'ollama', 'openrouter', 'alibaba', 'fireworks', 'groq', 'huggingface', 'bedrock', 'googlevertex', 'togetherai', 'lmstudio', 'moonshotai'
411
411
  * Default: 'openai'
412
412
  */
413
413
  provider: "openai",
@@ -1042,15 +1042,15 @@ Intlayer supports multiple AI providers for enhanced flexibility and choice. Cur
1042
1042
  - **Together.ai**
1043
1043
  - **LM Studio**
1044
1044
 
1045
- | Field | Description | Type | Default | Example | Note |
1046
- | -------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
1047
- | `provider` | The provider to use for the AI features of Intlayer. | `'openai'` &#124; <br/> `'anthropic'` &#124; <br/> `'mistral'` &#124; <br/> `'deepseek'` &#124; <br/> `'gemini'` &#124; <br/> `'ollama'` &#124; <br/> `'openrouter'` &#124; <br/> `'alibaba'` &#124; <br/> `'fireworks'` &#124; <br/> `'groq'` &#124; <br/> `'huggingface'` &#124; <br/> `'bedrock'` &#124; <br/> `'googleaistudio'` &#124; <br/> `'googlevertex'` &#124; <br/> `'togetherai'` &#124; <br/> `'lmstudio'` | `undefined` | `'anthropic'` | Different providers require different API keys and have different pricing. |
1048
- | `model` | The model to use for AI features. | `string` | None | `'gpt-4o-2024-11-20'` | Specific model varies by provider. |
1049
- | `temperature` | Controls the randomness of AI responses. | `number` | None | `0.1` | Higher temperature = more creative and less predictable. |
1050
- | `apiKey` | Your API key for the selected provider. | `string` | None | `process.env.OPENAI_API_KEY` | Keep secret; store in environment variables. |
1051
- | `applicationContext` | Additional context about your application to help the AI generate more accurate translations (domain, audience, tone, terminology). | `string` | None | `'My application context'` | Can be used to add rules (e.g. `"You should not transform urls"`). |
1052
- | `baseURL` | The base URL for the AI API. | `string` | None | `'https://api.openai.com/v1'` <br/> `'http://localhost:5000'` | Can point to a local or custom AI API endpoint. |
1053
- | `dataSerialization` | Data serialization format for AI features. | `'json'` &#124; <br/> `'toon'` | `undefined` | `'toon'` | • `'json'`: standard, reliable; uses more tokens.<br/>• `'toon'`: fewer tokens, less consistent.<br/>• Additional parameters are passed to the AI model as context (reasoning effort, verbosity, etc.). |
1045
+ | Field | Description | Type | Default | Example | Note |
1046
+ | -------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
1047
+ | `provider` | The provider to use for the AI features of Intlayer. | `'openai'` &#124; <br/> `'anthropic'` &#124; <br/> `'mistral'` &#124; <br/> `'deepseek'` &#124; <br/> `'gemini'` &#124; <br/> `'ollama'` &#124; <br/> `'openrouter'` &#124; <br/> `'alibaba'` &#124; <br/> `'fireworks'` &#124; <br/> `'groq'` &#124; <br/> `'huggingface'` &#124; <br/> `'bedrock'` &#124; <br/> `'googleaistudio'` &#124; <br/> `'googlevertex'` &#124; <br/> `'togetherai'` &#124; <br/> `'lmstudio'` &#124; <br/> `'moonshotai'` | `undefined` | `'anthropic'` | Different providers require different API keys and have different pricing. |
1048
+ | `model` | The model to use for AI features. | `string` | None | `'gpt-4o-2024-11-20'` | Specific model varies by provider. |
1049
+ | `temperature` | Controls the randomness of AI responses. | `number` | None | `0.1` | Higher temperature = more creative and less predictable. |
1050
+ | `apiKey` | Your API key for the selected provider. | `string` | None | `process.env.OPENAI_API_KEY` | Keep secret; store in environment variables. |
1051
+ | `applicationContext` | Additional context about your application to help the AI generate more accurate translations (domain, audience, tone, terminology). | `string` | None | `'My application context'` | Can be used to add rules (e.g. `"You should not transform urls"`). |
1052
+ | `baseURL` | The base URL for the AI API. | `string` | None | `'https://api.openai.com/v1'` <br/> `'http://localhost:5000'` | Can point to a local or custom AI API endpoint. |
1053
+ | `dataSerialization` | Data serialization format for AI features. | `'json'` &#124; <br/> `'toon'` | `undefined` | `'toon'` | • `'json'`: standard, reliable; uses more tokens.<br/>• `'toon'`: fewer tokens, less consistent.<br/>• Additional parameters are passed to the AI model as context (reasoning effort, verbosity, etc.). |
1054
1054
 
1055
1055
  ### Build Configuration
1056
1056
 
@@ -207,7 +207,7 @@ export const ComponentExample = () => {
207
207
  This approach allows you to:
208
208
 
209
209
  1. **Increase the speed of development**
210
- - `.content.{{ts|mjs|cjs|json}}` files can be created using a VSCode extension
210
+ - `.content.{ts|js|mjs|cjs|json|tsx|jsx|md|mdx|yaml|yml}` files can be created using a VSCode extension
211
211
  - Autocompletion AI tools in your IDE (such as GitHub Copilot) can help you declare your content, reducing copy/paste
212
212
 
213
213
  2. **Clean your codebase**
@@ -231,27 +231,27 @@ This approach allows you to:
231
231
 
232
232
  ## Additional features of Intlayer
233
233
 
234
- | Feature | Description |
235
- | ------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
236
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/frameworks.png?raw=true) | **Cross-Frameworks Support**<br><br>Intlayer is compatible with all major frameworks and libraries, including Next.js, React, Vite, Vue.js, Nuxt, Preact, Express, and more. |
237
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/javascript_content_management.jpg?raw=true) | **JavaScript-Powered Content Management**<br><br>Harness the flexibility of JavaScript to define and manage your content efficiently. <br><br> - [Content declaration](https://intlayer.org/doc/concept/content) |
238
- | <img src="https://github.com/aymericzip/intlayer/blob/main/docs/assets/compiler.jpg?raw=true" alt="Feature" width="700"> | **Compiler**<br><br>The Intlayer Compiler extract automatically the content from the components and generate the dictionary files.<br><br> - [Compiler](https://intlayer.org/doc/compiler) |
239
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/per_locale_content_declaration_file.png?raw=true) | **Per-Locale Content Declaration File**<br><br>Speed up your development by declaring your content once, before auto generation.<br><br> - [Per-Locale Content Declaration File](https://intlayer.org/doc/concept/per-locale-file) |
240
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true) | **Type-Safe Environment**<br><br>Leverage TypeScript to ensure your content definitions and code are error-free, while also benefiting from IDE autocompletion.<br><br> - [TypeScript configuration](https://intlayer.org/doc/environment/vite-and-react#configure-typescript) |
241
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/config_file.png?raw=true) | **Simplified Setup**<br><br>Get up and running quickly with minimal configuration. Adjust settings for internationalization, routing, AI, build, and content handling with ease. <br><br> - [Explore Next.js integration](https://intlayer.org/doc/environment/nextjs) |
242
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/content_retrieval.png?raw=true) | **Simplified Content Retrieval**<br><br>No need to call your `t` function for each piece of content. Retrieve all your content directly using a single hook.<br><br> - [React integration](https://intlayer.org/doc/environment/create-react-app) |
243
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/server_component.png?raw=true) | **Consistent Server Component Implementation**<br><br>Perfectly suited for Next.js server components, use the same implementation for both client and server components, no need to pass your `t` function across each server component. <br><br> - [Server Components](https://intlayer.org/doc/environment/nextjs#step-7-utilize-content-in-your-code) |
244
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/file_tree.png?raw=true) | **Organized Codebase**<br><br>Keep your codebase more organized: 1 component = 1 dictionary in the same folder. Translations close to their respective components enhance maintainability and clarity. <br><br> - [How Intlayer works](https://intlayer.org/doc/concept/how-works-intlayer) |
245
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/url_routing.png?raw=true) | **Enhanced Routing**<br><br>Full support of app routing, adapting seamlessly to complex application structures, for Next.js, React, Vite, Vue.js, etc.<br><br> - [Explore Next.js integration](https://intlayer.org/doc/environment/nextjs) |
246
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/markdown.png?raw=true) | **Markdown Support**<br><br>Import and interpret locale files and remote Markdown for multilingual content like privacy policies, documentation, etc. Interpret and make Markdown metadata accessible in your code.<br><br> - [Content files](https://intlayer.org/doc/concept/content/file) |
247
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/visual_editor.png?raw=true) | **Free Visual Editor & CMS**<br><br>A free visual editor and CMS are available for content writers, removing the need for a localization platform. Keep your content synchronized using Git, or externalize it totally or partially with the CMS.<br><br> - [Intlayer Editor](https://intlayer.org/doc/concept/editor) <br> - [Intlayer CMS](https://intlayer.org/doc/concept/cms) |
248
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true) | **Tree-shakable Content**<br><br>Tree-shakable content, reducing the size of the final bundle. Loads content per component, excluding any unused content from your bundle. Supports lazy loading to enhance app loading efficiency. <br><br> - [App build optimization](https://intlayer.org/doc/concept/how-works-intlayer#app-build-optimization) |
249
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/static_rendering.png?raw=true) | **Static Rendering**<br><br>Doesn't block Static Rendering. <br><br> - [Next.js integration](https://intlayer.org/doc/environment/nextjs) |
250
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/AI_translation.png?raw=true) | **AI-Powered Translation**<br><br>Transform your website into 231 languages with just one click using Intlayer's advanced AI-powered translation tools using your own AI provider/API key. <br><br> - [CI/CD integration](https://intlayer.org/doc/concept/ci-cd) <br> - [Intlayer CLI](https://intlayer.org/doc/concept/cli) <br> - [Auto fill](https://intlayer.org/doc/concept/auto-fill) |
251
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/mcp.png?raw=true) | **MCP Server Integration**<br><br>Provides an MCP (Model Context Protocol) server for IDE automation, enabling seamless content management and i18n workflows directly within your development environment. <br><br> - [MCP Server](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/mcp_server.md) |
252
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vscode_extension.png?raw=true) | **VSCode Extension**<br><br>Intlayer provides a VSCode extension to help you manage your content and translations, building your dictionaries, translating your content, and more. <br><br> - [VSCode Extension](https://intlayer.org/doc/vs-code-extension) |
253
- | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/interoperability.png?raw=true) | **Interoperability**<br><br>Allows interoperability with react-i18next, next-i18next, next-intl, and react-intl. <br><br> - [Intlayer and react-intl](https://intlayer.org/blog/intlayer-with-react-intl) <br> - [Intlayer and next-intl](https://intlayer.org/blog/intlayer-with-next-intl) <br> - [Intlayer and next-i18next](https://intlayer.org/blog/intlayer-with-next-i18next) |
254
- | Testing Missing Translations (CLI/CI) | ✅ CLI: npx intlayer content test (CI-friendly audit) |
234
+ | Feature | Description |
235
+ | ------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
236
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/frameworks.png?raw=true) | **Cross-Frameworks Support**<br><br>Intlayer is compatible with all major frameworks and libraries, including Next.js, React, Vite, Vue.js, Nuxt, Preact, Express, and more. |
237
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/javascript_content_management.jpg?raw=true) | **JavaScript-Powered Content Management**<br><br>Harness the flexibility of JavaScript to define and manage your content efficiently. <br><br> - [Content declaration](https://intlayer.org/doc/concept/content) |
238
+ | <img src="https://github.com/aymericzip/intlayer/blob/main/docs/assets/compiler.jpg?raw=true" alt="Feature" width="700"> | **Compiler**<br><br>The Intlayer Compiler extract automatically the content from the components and generate the dictionary files.<br><br> - [Compiler](https://intlayer.org/doc/compiler) |
239
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/per_locale_content_declaration_file.png?raw=true) | **Per-Locale Content Declaration File**<br><br>Speed up your development by declaring your content once, before auto generation.<br><br> - [Per-Locale Content Declaration File](https://intlayer.org/doc/concept/per-locale-file) |
240
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true) | **Type-Safe Environment**<br><br>Leverage TypeScript to ensure your content definitions and code are error-free, while also benefiting from IDE autocompletion.<br><br> - [TypeScript configuration](https://intlayer.org/doc/environment/vite-and-react#configure-typescript) |
241
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/config_file.png?raw=true) | **Simplified Setup**<br><br>Get up and running quickly with minimal configuration. Adjust settings for internationalization, routing, AI, build, and content handling with ease. <br><br> - [Explore Next.js integration](https://intlayer.org/doc/environment/nextjs) |
242
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/content_retrieval.png?raw=true) | **Simplified Content Retrieval**<br><br>No need to call your `t` function for each piece of content. Retrieve all your content directly using a single hook.<br><br> - [React integration](https://intlayer.org/doc/environment/create-react-app) |
243
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/server_component.png?raw=true) | **Consistent Server Component Implementation**<br><br>Perfectly suited for Next.js server components, use the same implementation for both client and server components, no need to pass your `t` function across each server component. <br><br> - [Server Components](https://intlayer.org/doc/environment/nextjs#step-7-utilize-content-in-your-code) |
244
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/file_tree.png?raw=true) | **Organized Codebase**<br><br>Keep your codebase more organized: 1 component = 1 dictionary in the same folder. Translations close to their respective components enhance maintainability and clarity. <br><br> - [How Intlayer works](https://intlayer.org/doc/concept/how-works-intlayer) |
245
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/url_routing.png?raw=true) | **Enhanced Routing**<br><br>Full support of app routing, adapting seamlessly to complex application structures, for Next.js, React, Vite, Vue.js, etc.<br><br> - [Explore Next.js integration](https://intlayer.org/doc/environment/nextjs) |
246
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/markdown.png?raw=true) | **Markdown Support**<br><br>Import and interpret locale files and remote Markdown for multilingual content like privacy policies, documentation, etc. Interpret and make Markdown metadata accessible in your code.<br><br> - [Content files](https://intlayer.org/doc/concept/content/file) |
247
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/visual_editor.png?raw=true) | **Free Visual Editor & CMS**<br><br>A free visual editor and CMS are available for content writers, removing the need for a localization platform. Keep your content synchronized using Git, or externalize it totally or partially with the CMS.<br><br> - [Intlayer Editor](https://intlayer.org/doc/concept/editor) <br> - [Intlayer CMS](https://intlayer.org/doc/concept/cms) |
248
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/bundle.png?raw=true) | **Tree-shakable Content**<br><br>Tree-shakable content, reducing the size of the final bundle. Loads content per component, excluding any unused content from your bundle. Supports lazy loading to enhance app loading efficiency. <br><br> - [App build optimization](https://intlayer.org/doc/concept/how-works-intlayer#app-build-optimization) |
249
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/static_rendering.png?raw=true) | **Static Rendering**<br><br>Doesn't block Static Rendering. <br><br> - [Next.js integration](https://intlayer.org/doc/environment/nextjs) |
250
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/AI_translation.png?raw=true) | **AI-Powered Translation**<br><br>Transform your website into 231 languages with just one click using Intlayer's advanced AI-powered translation tools using your own AI provider/API key. <br><br> - [CI/CD integration](https://intlayer.org/doc/concept/ci-cd) <br> - [Intlayer CLI](https://intlayer.org/doc/concept/cli) <br> - [Auto fill](https://intlayer.org/doc/concept/auto-fill) |
251
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/mcp.png?raw=true) | **MCP Server Integration**<br><br>Provides an MCP (Model Context Protocol) server for IDE automation, enabling seamless content management and i18n workflows directly within your development environment. <br><br> - [MCP Server](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/mcp_server.md) |
252
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/vscode_extension.png?raw=true) | **VSCode Extension**<br><br>Intlayer provides a VSCode extension to help you manage your content and translations, building your dictionaries, translating your content, and more. <br><br> - [VSCode Extension](https://intlayer.org/doc/vs-code-extension) |
253
+ | ![Feature](https://github.com/aymericzip/intlayer/blob/main/docs/assets/interoperability.png?raw=true) | **Interoperability**<br><br>Allows interoperability with react-i18next, next-i18next, next-intl, and react-intl. <br><br> - [Intlayer and react-intl](https://intlayer.org/blog/intlayer-with-react-intl) <br> - [Intlayer and next-intl](https://intlayer.org/blog/intlayer-with-next-intl) <br> - [Intlayer and next-i18next](https://intlayer.org/blog/intlayer-with-next-i18next) <br> - [Intlayer compat adapters](https://intlayer.org/doc/compatibility) |
254
+ | Testing Missing Translations (CLI/CI) | ✅ CLI: npx intlayer content test (CI-friendly audit) |
255
255
 
256
256
  ## Comparison of Intlayer with other solutions
257
257
 
@@ -290,3 +290,5 @@ GitHub stars are a strong indicator of a project's popularity, community trust,
290
290
  `intlayer` can also help to manage your `react-intl`, `react-i18next`, `next-intl`, `next-i18next`, and `vue-i18n` namespaces.
291
291
 
292
292
  Using `intlayer`, you can declare your content in the format of your favorite i18n library, and intlayer will generate your namespaces in the location of your choice (example: `/messages/{{locale}}/{{namespace}}.json`).
293
+
294
+ If you want to keep using the API of your current i18n library, `intlayer` also provides **compat adapters**: packages exposing the exact same API as `react-i18next`, `next-intl`, `react-intl`, `vue-i18n`, and more, but served by Intlayer dictionaries. This lets you migrate progressively without rewriting your code. See the [Compat Adapters documentation](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/compat/index.md).
@@ -408,7 +408,7 @@ export const getLocale = (event: RequestEvent): Locale => {
408
408
  };
409
409
  ```
410
410
 
411
- > `getLocaleFromStorage` will check the locale from header or cookie depending on your configuration. See [Configuration](https://intlayer.org/doc/configuration) for more details.
411
+ > `getLocaleFromStorage` will check the locale from header or cookie depending on your configuration. See [Configuration](https://intlayer.org/doc/concept/configuration) for more details.
412
412
 
413
413
  > The `localeDetector` function will treat the `Accept-Language` header and return the best match.
414
414
 
@@ -257,19 +257,21 @@ import {
257
257
  HeadContent,
258
258
  Scripts,
259
259
  createRootRouteWithContext,
260
+ getRouteApi,
260
261
  } from "@tanstack/solid-router";
261
262
  import { HydrationScript } from "solid-js/web";
262
263
  import { Suspense, type ParentComponent } from "solid-js";
263
264
  import { IntlayerProvider } from "solid-intlayer";
264
265
  import { defaultLocale, getHTMLTextDir } from "intlayer";
265
- import { Route as LocaleRoute } from "./{-$locale}/route";
266
+
267
+ const localeRoute = getRouteApi("/{-$locale}");
266
268
 
267
269
  export const Route = createRootRouteWithContext()({
268
270
  shellComponent: RootComponent,
269
271
  });
270
272
 
271
273
  const RootComponent: ParentComponent = (props) => {
272
- const params = LocaleRoute.useParams();
274
+ const params = localeRoute.useParams();
273
275
  const locale = params()?.locale ?? defaultLocale;
274
276
 
275
277
  return (
@@ -554,7 +556,7 @@ As seen in Step 5, you can manage the `lang` and `dir` attributes of the `html`
554
556
 
555
557
  ```tsx fileName="src/routes/__root.tsx"
556
558
  const RootComponent: ParentComponent = (props) => {
557
- const params = LocaleRoute.useParams();
559
+ const params = localeRoute.useParams();
558
560
  const locale = params()?.locale ?? defaultLocale;
559
561
 
560
562
  return (
@@ -274,13 +274,15 @@ Configure your root layout to support internationalization by using `useParams`
274
274
  ```tsx fileName="src/routes/__root.tsx"
275
275
  import {
276
276
  createRootRouteWithContext,
277
+ getRouteApi,
277
278
  HeadContent,
278
279
  Scripts,
279
280
  } from "@tanstack/react-router";
280
281
  import { defaultLocale, getHTMLTextDir } from "intlayer";
281
282
  import { type ReactNode } from "react";
282
283
  import { IntlayerProvider } from "react-intlayer";
283
- import { Route as LocaleRoute } from "./{-$locale}/route";
284
+
285
+ const localeRoute = getRouteApi("/{-$locale}");
284
286
 
285
287
  export const Route = createRootRouteWithContext<{}>()({
286
288
  head: () => ({
@@ -302,7 +304,7 @@ export const Route = createRootRouteWithContext<{}>()({
302
304
  });
303
305
 
304
306
  function RootDocument({ children }: { children: ReactNode }) {
305
- const params = LocaleRoute.useParams();
307
+ const params = localeRoute.useParams();
306
308
  const locale = params?.locale ?? defaultLocale;
307
309
 
308
310
  return (
@@ -635,7 +637,7 @@ As seen in Step 5, you can manage the `lang` and `dir` attributes of the `html`
635
637
 
636
638
  ```tsx fileName="src/routes/__root.tsx"
637
639
  function RootDocument({ children }: { children: ReactNode }) {
638
- const params = LocaleRoute.useParams();
640
+ const params = localeRoute.useParams();
639
641
  const locale = params?.locale ?? defaultLocale;
640
642
 
641
643
  return (
@@ -12,6 +12,10 @@ keywords:
12
12
  - Intlayer
13
13
  - Next.js
14
14
  - Vite
15
+ slugs:
16
+ - doc
17
+ - concept
18
+ - live-sync
15
19
  history:
16
20
  - version: 9.0.0
17
21
  date: 2026-07-08