@intlayer/docs 6.1.6-canary.0 → 6.1.6

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 (242) hide show
  1. package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +71 -80
  2. package/dist/cjs/generated/docs.entry.cjs +16 -0
  3. package/dist/cjs/generated/docs.entry.cjs.map +1 -1
  4. package/dist/esm/generated/docs.entry.mjs +16 -0
  5. package/dist/esm/generated/docs.entry.mjs.map +1 -1
  6. package/dist/types/generated/docs.entry.d.ts +1 -0
  7. package/dist/types/generated/docs.entry.d.ts.map +1 -1
  8. package/docs/ar/intlayer_with_angular.md +2 -2
  9. package/docs/ar/intlayer_with_astro.md +246 -0
  10. package/docs/ar/intlayer_with_create_react_app.md +3 -2
  11. package/docs/ar/intlayer_with_express.md +2 -2
  12. package/docs/ar/intlayer_with_nestjs.md +2 -2
  13. package/docs/ar/intlayer_with_nextjs_14.md +2 -2
  14. package/docs/ar/intlayer_with_nextjs_15.md +2 -2
  15. package/docs/ar/intlayer_with_nextjs_page_router.md +2 -2
  16. package/docs/ar/intlayer_with_nuxt.md +2 -2
  17. package/docs/ar/intlayer_with_react_native+expo.md +11 -20
  18. package/docs/ar/intlayer_with_react_router_v7.md +195 -241
  19. package/docs/ar/intlayer_with_tanstack.md +198 -272
  20. package/docs/ar/intlayer_with_vite+preact.md +9 -9
  21. package/docs/ar/intlayer_with_vite+react.md +7 -7
  22. package/docs/ar/intlayer_with_vite+vue.md +9 -9
  23. package/docs/de/intlayer_with_angular.md +2 -2
  24. package/docs/de/intlayer_with_astro.md +246 -0
  25. package/docs/de/intlayer_with_create_react_app.md +2 -2
  26. package/docs/de/intlayer_with_express.md +2 -2
  27. package/docs/de/intlayer_with_nestjs.md +2 -2
  28. package/docs/de/intlayer_with_nextjs_14.md +2 -2
  29. package/docs/de/intlayer_with_nextjs_15.md +2 -2
  30. package/docs/de/intlayer_with_nextjs_page_router.md +2 -2
  31. package/docs/de/intlayer_with_nuxt.md +2 -2
  32. package/docs/de/intlayer_with_react_native+expo.md +11 -20
  33. package/docs/de/intlayer_with_react_router_v7.md +193 -242
  34. package/docs/de/intlayer_with_tanstack.md +194 -266
  35. package/docs/de/intlayer_with_vite+preact.md +9 -9
  36. package/docs/de/intlayer_with_vite+react.md +9 -9
  37. package/docs/de/intlayer_with_vite+vue.md +11 -11
  38. package/docs/de/packages/vite-intlayer/index.md +3 -3
  39. package/docs/en/how_works_intlayer.md +1 -1
  40. package/docs/en/index.md +1 -1
  41. package/docs/en/intlayer_cli.md +1 -1
  42. package/docs/en/intlayer_with_angular.md +4 -4
  43. package/docs/en/intlayer_with_astro.md +246 -0
  44. package/docs/en/intlayer_with_create_react_app.md +4 -4
  45. package/docs/en/intlayer_with_express.md +3 -3
  46. package/docs/en/intlayer_with_lynx+react.md +1 -1
  47. package/docs/en/intlayer_with_nestjs.md +2 -2
  48. package/docs/en/intlayer_with_nextjs_14.md +13 -4
  49. package/docs/en/intlayer_with_nextjs_15.md +13 -4
  50. package/docs/en/intlayer_with_nextjs_page_router.md +5 -5
  51. package/docs/en/intlayer_with_nuxt.md +4 -4
  52. package/docs/en/intlayer_with_react_native+expo.md +46 -24
  53. package/docs/en/intlayer_with_react_router_v7.md +164 -211
  54. package/docs/en/intlayer_with_tanstack.md +166 -241
  55. package/docs/en/intlayer_with_vite+preact.md +12 -12
  56. package/docs/en/intlayer_with_vite+react.md +12 -12
  57. package/docs/en/intlayer_with_vite+solid.md +2 -2
  58. package/docs/en/intlayer_with_vite+svelte.md +2 -2
  59. package/docs/en/intlayer_with_vite+vue.md +12 -12
  60. package/docs/en/introduction.md +1 -1
  61. package/docs/en/packages/next-intlayer/useDictionary.md +1 -1
  62. package/docs/en/packages/next-intlayer/useIntlayer.md +1 -1
  63. package/docs/en/packages/react-intlayer/useDictionary.md +1 -1
  64. package/docs/en/packages/react-intlayer/useI18n.md +1 -1
  65. package/docs/en/packages/react-intlayer/useIntlayer.md +1 -1
  66. package/docs/en/releases/v6.md +1 -0
  67. package/docs/en/roadmap.md +1 -1
  68. package/docs/en-GB/intlayer_with_angular.md +3 -3
  69. package/docs/en-GB/intlayer_with_astro.md +246 -0
  70. package/docs/en-GB/intlayer_with_create_react_app.md +5 -4
  71. package/docs/en-GB/intlayer_with_express.md +2 -2
  72. package/docs/en-GB/intlayer_with_nestjs.md +2 -2
  73. package/docs/en-GB/intlayer_with_nextjs_14.md +4 -4
  74. package/docs/en-GB/intlayer_with_nextjs_15.md +2 -2
  75. package/docs/en-GB/intlayer_with_nextjs_page_router.md +2 -2
  76. package/docs/en-GB/intlayer_with_nuxt.md +2 -2
  77. package/docs/en-GB/intlayer_with_react_native+expo.md +11 -20
  78. package/docs/en-GB/intlayer_with_react_router_v7.md +171 -220
  79. package/docs/en-GB/intlayer_with_tanstack.md +174 -248
  80. package/docs/en-GB/intlayer_with_vite+preact.md +9 -9
  81. package/docs/en-GB/intlayer_with_vite+react.md +9 -9
  82. package/docs/en-GB/intlayer_with_vite+vue.md +11 -11
  83. package/docs/en-GB/packages/next-intlayer/useIntlayer.md +1 -1
  84. package/docs/en-GB/packages/react-intlayer/useIntlayer.md +1 -1
  85. package/docs/es/intlayer_with_angular.md +2 -2
  86. package/docs/es/intlayer_with_astro.md +246 -0
  87. package/docs/es/intlayer_with_create_react_app.md +3 -2
  88. package/docs/es/intlayer_with_express.md +2 -2
  89. package/docs/es/intlayer_with_nextjs_14.md +2 -2
  90. package/docs/es/intlayer_with_nextjs_15.md +2 -2
  91. package/docs/es/intlayer_with_react_native+expo.md +11 -20
  92. package/docs/es/intlayer_with_react_router_v7.md +188 -232
  93. package/docs/es/intlayer_with_tanstack.md +203 -273
  94. package/docs/es/intlayer_with_vite+preact.md +7 -7
  95. package/docs/es/intlayer_with_vite+react.md +7 -7
  96. package/docs/es/intlayer_with_vite+vue.md +9 -9
  97. package/docs/fr/intlayer_with_angular.md +2 -2
  98. package/docs/fr/intlayer_with_astro.md +246 -0
  99. package/docs/fr/intlayer_with_create_react_app.md +3 -2
  100. package/docs/fr/intlayer_with_express.md +2 -2
  101. package/docs/fr/intlayer_with_nestjs.md +2 -2
  102. package/docs/fr/intlayer_with_nextjs_14.md +2 -2
  103. package/docs/fr/intlayer_with_react_native+expo.md +11 -20
  104. package/docs/fr/intlayer_with_react_router_v7.md +188 -248
  105. package/docs/fr/intlayer_with_tanstack.md +192 -265
  106. package/docs/fr/intlayer_with_vite+preact.md +7 -7
  107. package/docs/fr/intlayer_with_vite+react.md +7 -7
  108. package/docs/fr/intlayer_with_vite+vue.md +9 -9
  109. package/docs/hi/intlayer_cli.md +1 -4
  110. package/docs/hi/intlayer_with_angular.md +2 -2
  111. package/docs/hi/intlayer_with_astro.md +246 -0
  112. package/docs/hi/intlayer_with_create_react_app.md +2 -2
  113. package/docs/hi/intlayer_with_express.md +2 -2
  114. package/docs/hi/intlayer_with_nestjs.md +2 -2
  115. package/docs/hi/intlayer_with_nextjs_14.md +2 -2
  116. package/docs/hi/intlayer_with_nextjs_15.md +2 -2
  117. package/docs/hi/intlayer_with_nextjs_page_router.md +2 -2
  118. package/docs/hi/intlayer_with_nuxt.md +2 -2
  119. package/docs/hi/intlayer_with_react_native+expo.md +11 -20
  120. package/docs/hi/intlayer_with_react_router_v7.md +199 -243
  121. package/docs/hi/intlayer_with_tanstack.md +210 -285
  122. package/docs/hi/intlayer_with_vite+preact.md +9 -9
  123. package/docs/hi/intlayer_with_vite+react.md +9 -9
  124. package/docs/hi/intlayer_with_vite+solid.md +1 -1
  125. package/docs/hi/intlayer_with_vite+vue.md +11 -11
  126. package/docs/it/intlayer_with_angular.md +2 -2
  127. package/docs/it/intlayer_with_astro.md +246 -0
  128. package/docs/it/intlayer_with_create_react_app.md +3 -2
  129. package/docs/it/intlayer_with_express.md +2 -2
  130. package/docs/it/intlayer_with_nestjs.md +2 -2
  131. package/docs/it/intlayer_with_nextjs_14.md +2 -2
  132. package/docs/it/intlayer_with_nextjs_15.md +2 -2
  133. package/docs/it/intlayer_with_nextjs_page_router.md +2 -2
  134. package/docs/it/intlayer_with_nuxt.md +2 -2
  135. package/docs/it/intlayer_with_react_native+expo.md +11 -21
  136. package/docs/it/intlayer_with_react_router_v7.md +195 -242
  137. package/docs/it/intlayer_with_tanstack.md +203 -267
  138. package/docs/it/intlayer_with_vite+preact.md +9 -9
  139. package/docs/it/intlayer_with_vite+react.md +13 -11
  140. package/docs/it/intlayer_with_vite+vue.md +11 -11
  141. package/docs/ja/intlayer_with_angular.md +2 -2
  142. package/docs/ja/intlayer_with_astro.md +246 -0
  143. package/docs/ja/intlayer_with_create_react_app.md +3 -2
  144. package/docs/ja/intlayer_with_express.md +2 -2
  145. package/docs/ja/intlayer_with_nestjs.md +2 -2
  146. package/docs/ja/intlayer_with_nextjs_14.md +2 -2
  147. package/docs/ja/intlayer_with_nextjs_15.md +2 -2
  148. package/docs/ja/intlayer_with_nextjs_page_router.md +2 -2
  149. package/docs/ja/intlayer_with_nuxt.md +2 -2
  150. package/docs/ja/intlayer_with_react_native+expo.md +18 -29
  151. package/docs/ja/intlayer_with_react_router_v7.md +204 -250
  152. package/docs/ja/intlayer_with_tanstack.md +218 -286
  153. package/docs/ja/intlayer_with_vite+preact.md +9 -9
  154. package/docs/ja/intlayer_with_vite+react.md +11 -11
  155. package/docs/ja/intlayer_with_vite+vue.md +11 -11
  156. package/docs/ko/intlayer_with_angular.md +2 -2
  157. package/docs/ko/intlayer_with_astro.md +246 -0
  158. package/docs/ko/intlayer_with_create_react_app.md +3 -2
  159. package/docs/ko/intlayer_with_express.md +2 -2
  160. package/docs/ko/intlayer_with_nestjs.md +2 -2
  161. package/docs/ko/intlayer_with_nextjs_14.md +2 -2
  162. package/docs/ko/intlayer_with_nextjs_15.md +2 -2
  163. package/docs/ko/intlayer_with_nextjs_page_router.md +2 -2
  164. package/docs/ko/intlayer_with_nuxt.md +2 -2
  165. package/docs/ko/intlayer_with_react_native+expo.md +19 -28
  166. package/docs/ko/intlayer_with_react_router_v7.md +190 -244
  167. package/docs/ko/intlayer_with_tanstack.md +200 -270
  168. package/docs/ko/intlayer_with_vite+preact.md +9 -9
  169. package/docs/ko/intlayer_with_vite+react.md +9 -9
  170. package/docs/ko/intlayer_with_vite+vue.md +11 -11
  171. package/docs/pt/intlayer_with_angular.md +2 -2
  172. package/docs/pt/intlayer_with_astro.md +246 -0
  173. package/docs/pt/intlayer_with_create_react_app.md +3 -2
  174. package/docs/pt/intlayer_with_express.md +2 -2
  175. package/docs/pt/intlayer_with_nestjs.md +2 -2
  176. package/docs/pt/intlayer_with_nextjs_14.md +2 -2
  177. package/docs/pt/intlayer_with_nextjs_15.md +2 -2
  178. package/docs/pt/intlayer_with_nextjs_page_router.md +2 -2
  179. package/docs/pt/intlayer_with_nuxt.md +2 -2
  180. package/docs/pt/intlayer_with_react_native+expo.md +11 -20
  181. package/docs/pt/intlayer_with_react_router_v7.md +7 -13
  182. package/docs/pt/intlayer_with_tanstack.md +183 -258
  183. package/docs/pt/intlayer_with_vite+preact.md +9 -9
  184. package/docs/pt/intlayer_with_vite+react.md +9 -9
  185. package/docs/pt/intlayer_with_vite+vue.md +9 -9
  186. package/docs/ru/intlayer_with_angular.md +2 -2
  187. package/docs/ru/intlayer_with_astro.md +246 -0
  188. package/docs/ru/intlayer_with_create_react_app.md +3 -2
  189. package/docs/ru/intlayer_with_express.md +2 -2
  190. package/docs/ru/intlayer_with_nestjs.md +2 -2
  191. package/docs/ru/intlayer_with_nextjs_14.md +2 -2
  192. package/docs/ru/intlayer_with_nextjs_15.md +2 -2
  193. package/docs/ru/intlayer_with_nextjs_page_router.md +2 -2
  194. package/docs/ru/intlayer_with_nuxt.md +2 -2
  195. package/docs/ru/intlayer_with_react_native+expo.md +11 -20
  196. package/docs/ru/intlayer_with_react_router_v7.md +192 -238
  197. package/docs/ru/intlayer_with_tanstack.md +197 -269
  198. package/docs/ru/intlayer_with_vite+preact.md +9 -9
  199. package/docs/ru/intlayer_with_vite+react.md +9 -9
  200. package/docs/ru/intlayer_with_vite+vue.md +11 -11
  201. package/docs/tr/how_works_intlayer.md +1 -1
  202. package/docs/tr/index.md +1 -1
  203. package/docs/tr/intlayer_cli.md +1 -1
  204. package/docs/tr/intlayer_with_angular.md +4 -4
  205. package/docs/tr/intlayer_with_astro.md +246 -0
  206. package/docs/tr/intlayer_with_create_react_app.md +4 -4
  207. package/docs/tr/intlayer_with_express.md +3 -3
  208. package/docs/tr/intlayer_with_lynx+react.md +1 -1
  209. package/docs/tr/intlayer_with_nestjs.md +2 -2
  210. package/docs/tr/intlayer_with_nextjs_14.md +2 -2
  211. package/docs/tr/intlayer_with_nextjs_15.md +4 -4
  212. package/docs/tr/intlayer_with_nextjs_page_router.md +5 -5
  213. package/docs/tr/intlayer_with_nuxt.md +4 -4
  214. package/docs/tr/intlayer_with_react_native+expo.md +12 -21
  215. package/docs/tr/intlayer_with_react_router_v7.md +222 -267
  216. package/docs/tr/intlayer_with_tanstack.md +400 -303
  217. package/docs/tr/intlayer_with_vite+preact.md +12 -12
  218. package/docs/tr/intlayer_with_vite+react.md +12 -12
  219. package/docs/tr/intlayer_with_vite+solid.md +2 -2
  220. package/docs/tr/intlayer_with_vite+svelte.md +2 -2
  221. package/docs/tr/intlayer_with_vite+vue.md +12 -12
  222. package/docs/tr/introduction.md +1 -1
  223. package/docs/tr/packages/react-intlayer/useDictionary.md +1 -1
  224. package/docs/tr/packages/react-intlayer/useI18n.md +1 -1
  225. package/docs/tr/roadmap.md +1 -1
  226. package/docs/zh/intlayer_with_angular.md +2 -2
  227. package/docs/zh/intlayer_with_astro.md +246 -0
  228. package/docs/zh/intlayer_with_create_react_app.md +3 -2
  229. package/docs/zh/intlayer_with_express.md +2 -2
  230. package/docs/zh/intlayer_with_nestjs.md +2 -2
  231. package/docs/zh/intlayer_with_nextjs_14.md +2 -2
  232. package/docs/zh/intlayer_with_nextjs_15.md +2 -2
  233. package/docs/zh/intlayer_with_nextjs_page_router.md +2 -2
  234. package/docs/zh/intlayer_with_nuxt.md +2 -2
  235. package/docs/zh/intlayer_with_react_native+expo.md +19 -28
  236. package/docs/zh/intlayer_with_react_router_v7.md +200 -248
  237. package/docs/zh/intlayer_with_tanstack.md +208 -283
  238. package/docs/zh/intlayer_with_vite+preact.md +9 -9
  239. package/docs/zh/intlayer_with_vite+react.md +9 -9
  240. package/docs/zh/intlayer_with_vite+vue.md +9 -9
  241. package/package.json +11 -11
  242. package/src/generated/docs.entry.ts +16 -0
@@ -1055,38 +1055,38 @@ const App = () => (
1055
1055
  module.exports = App;
1056
1056
  ```
1057
1057
 
1058
- En paralelo, también puedes usar el `intlayerMiddlewarePlugin` para agregar enrutamiento del lado del servidor a tu aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional apropiada. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada según las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
1058
+ En paralelo, también puedes usar el `intlayerMiddleware` para agregar enrutamiento del lado del servidor a tu aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional apropiada. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada según las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
1059
1059
 
1060
1060
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
1061
1061
  import { defineConfig } from "vite";
1062
1062
  import preact from "@preact/preset-vite";
1063
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1063
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1064
1064
 
1065
1065
  // https://vitejs.dev/config/
1066
1066
  export default defineConfig({
1067
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1067
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1068
1068
  });
1069
1069
  ```
1070
1070
 
1071
1071
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
1072
1072
  import { defineConfig } from "vite";
1073
1073
  import preact from "@preact/preset-vite";
1074
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1074
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1075
1075
 
1076
1076
  // https://vitejs.dev/config/
1077
1077
  export default defineConfig({
1078
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1078
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1079
1079
  });
1080
1080
  ```
1081
1081
 
1082
1082
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
1083
1083
  const { defineConfig } = require("vite");
1084
1084
  const preact = require("@preact/preset-vite");
1085
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
1085
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
1086
1086
 
1087
1087
  // https://vitejs.dev/config/
1088
1088
  module.exports = defineConfig({
1089
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1089
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1090
1090
  });
1091
1091
  ```
1092
1092
 
@@ -1003,38 +1003,38 @@ const App = () => (
1003
1003
  );
1004
1004
  ```
1005
1005
 
1006
- Paralelamente, también puedes usar el `intlayerMiddlewarePlugin` para agregar enrutamiento del lado del servidor a tu aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional correspondiente. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada basándose en las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
1006
+ Paralelamente, también puedes usar el `intlayerMiddleware` para agregar enrutamiento del lado del servidor a tu aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional correspondiente. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada basándose en las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
1007
1007
 
1008
1008
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
1009
1009
  import { defineConfig } from "vite";
1010
1010
  import react from "@vitejs/plugin-react-swc";
1011
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1011
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1012
1012
 
1013
1013
  // https://vitejs.dev/config/
1014
1014
  export default defineConfig({
1015
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1015
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1016
1016
  });
1017
1017
  ```
1018
1018
 
1019
1019
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
1020
1020
  import { defineConfig } from "vite";
1021
1021
  import react from "@vitejs/plugin-react-swc";
1022
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1022
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1023
1023
 
1024
1024
  // https://vitejs.dev/config/
1025
1025
  export default defineConfig({
1026
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1026
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1027
1027
  });
1028
1028
  ```
1029
1029
 
1030
1030
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
1031
1031
  const { defineConfig } = require("vite");
1032
1032
  const react = require("@vitejs/plugin-react-swc");
1033
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
1033
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
1034
1034
 
1035
1035
  // https://vitejs.dev/config/
1036
1036
  module.exports = defineConfig({
1037
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1037
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1038
1038
  });
1039
1039
  ```
1040
1040
 
@@ -697,46 +697,46 @@ import LocaleSwitcher from "@components/LocaleSwitcher.vue";
697
697
  </template>
698
698
  ```
699
699
 
700
- Paralelamente, también puede usar el `intlayerMiddlewarePlugin` para agregar enrutamiento del lado del servidor a su aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional correspondiente. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada según las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
700
+ Paralelamente, también puede usar el `intlayerMiddleware` para agregar enrutamiento del lado del servidor a su aplicación. Este plugin detectará automáticamente la configuración regional actual basada en la URL y establecerá la cookie de configuración regional correspondiente. Si no se especifica ninguna configuración regional, el plugin determinará la configuración regional más adecuada según las preferencias de idioma del navegador del usuario. Si no se detecta ninguna configuración regional, redirigirá a la configuración regional predeterminada.
701
701
 
702
702
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
703
703
  import { defineConfig } from "vite";
704
704
  import vue from "@vitejs/plugin-vue";
705
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
705
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
706
706
 
707
707
  // https://vitejs.dev/config/
708
708
  export default defineConfig({
709
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
709
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
710
710
  });
711
711
  ```
712
712
 
713
713
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
714
714
  import { defineConfig } from "vite";
715
715
  import vue from "@vitejs/plugin-vue";
716
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
716
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
717
717
 
718
718
  // https://vitejs.dev/config/
719
719
  export default defineConfig({
720
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
720
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
721
721
  });
722
722
  ```
723
723
 
724
724
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
725
725
  const { defineConfig } = require("vite");
726
726
  const vue = require("@vitejs/plugin-vue");
727
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
727
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
728
728
 
729
729
  // https://vitejs.dev/config/
730
730
  module.exports = defineConfig({
731
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
731
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
732
732
  });
733
733
  const { defineConfig } = require("vite");
734
734
  const vue = require("@vitejs/plugin-vue");
735
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
735
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
736
736
 
737
737
  // https://vitejs.dev/config/
738
738
  module.exports = defineConfig({
739
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
739
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
740
740
  });
741
741
  ```
742
742
 
@@ -648,9 +648,9 @@ Pour des scénarios plus complexes, vous pouvez créer un pipe pour rendre le HT
648
648
 
649
649
  Intlayer utilise l'augmentation de module pour bénéficier de TypeScript et renforcer votre base de code.
650
650
 
651
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
651
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
652
652
 
653
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
653
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
654
654
 
655
655
  Assurez-vous que votre configuration TypeScript inclut les types générés automatiquement.
656
656
 
@@ -0,0 +1,246 @@
1
+ ---
2
+ createdAt: 2024-03-07
3
+ updatedAt: 2025-10-03
4
+ title: Prise en main d'Intlayer avec Astro
5
+ description: Apprenez à ajouter l'internationalisation (i18n) à votre application Vite et React en utilisant Intlayer. Suivez ce guide pour rendre votre application multilingue.
6
+ keywords:
7
+ - Internationalisation
8
+ - Documentation
9
+ - Intlayer
10
+ - Vite
11
+ - React
12
+ - i18n
13
+ - JavaScript
14
+ slugs:
15
+ - doc
16
+ - environment
17
+ - astro
18
+ applicationTemplate: https://github.com/aymericzip/intlayer-astro-template
19
+ ---
20
+
21
+ # Prise en main de l'internationalisation (i18n) avec Intlayer et Astro
22
+
23
+ Voir le [Modèle d'application](https://github.com/aymericzip/intlayer-astro-template) sur GitHub.
24
+
25
+ ## Qu'est-ce qu'Intlayer ?
26
+
27
+ **Intlayer** est une bibliothèque d'internationalisation (i18n) innovante et open-source conçue pour simplifier la prise en charge multilingue dans les applications web modernes.
28
+
29
+ Avec Intlayer, vous pouvez :
30
+
31
+ - **Gérer facilement les traductions** en utilisant des dictionnaires déclaratifs au niveau des composants.
32
+ - **Localiser dynamiquement les métadonnées**, les routes et le contenu.
33
+ - **Assurer la prise en charge de TypeScript** avec des types générés automatiquement, améliorant l'autocomplétion et la détection d'erreurs.
34
+ - **Bénéficier de fonctionnalités avancées**, comme la détection et le changement dynamiques de la langue.
35
+
36
+ ---
37
+
38
+ ## Guide étape par étape pour configurer Intlayer dans Astro
39
+
40
+ ### Étape 1 : Installer les dépendances
41
+
42
+ Installez les paquets nécessaires avec votre gestionnaire de paquets :
43
+
44
+ ```bash packageManager="npm"
45
+ npm install intlayer astro-intlayer
46
+ # Optionnel : ajouter le support des îles React
47
+ npm install react react-dom react-intlayer @astrojs/react
48
+ ```
49
+
50
+ ```bash packageManager="pnpm"
51
+ pnpm add intlayer astro-intlayer
52
+ # Optionnel : ajouter le support des îles React
53
+ pnpm add react react-dom react-intlayer @astrojs/react
54
+ ```
55
+
56
+ ```bash packageManager="yarn"
57
+ yarn add intlayer astro-intlayer
58
+ # Optionnel : ajouter le support des îles React
59
+ yarn add react react-dom react-intlayer @astrojs/react
60
+ ```
61
+
62
+ - **intlayer**
63
+ Le paquet principal qui fournit les outils d'internationalisation pour la gestion de la configuration, la traduction, la [déclaration de contenu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/get_started.md), la transpilation, et les [commandes CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_cli.md).
64
+
65
+ - **astro-intlayer**
66
+ Inclut le plugin d'intégration Astro pour intégrer Intlayer avec le [bundler Vite](https://vite.dev/guide/why.html#why-bundle-for-production), ainsi que le middleware pour détecter la locale préférée de l'utilisateur, gérer les cookies et gérer la redirection des URL.
67
+
68
+ ### Étape 2 : Configuration de votre projet
69
+
70
+ Créez un fichier de configuration pour configurer les langues de votre application :
71
+
72
+ ```typescript fileName="intlayer.config.ts"
73
+ import { Locales, type IntlayerConfig } from "intlayer";
74
+
75
+ const config: IntlayerConfig = {
76
+ internationalization: {
77
+ locales: [
78
+ Locales.ENGLISH,
79
+ Locales.FRENCH,
80
+ Locales.SPANISH,
81
+ // Vos autres locales
82
+ ],
83
+ defaultLocale: Locales.ENGLISH,
84
+ },
85
+ };
86
+
87
+ export default config;
88
+ ```
89
+
90
+ > Grâce à ce fichier de configuration, vous pouvez configurer des URL localisées, la redirection via middleware, les noms des cookies, l'emplacement et l'extension de vos déclarations de contenu, désactiver les logs Intlayer dans la console, et bien plus encore. Pour une liste complète des paramètres disponibles, consultez la [documentation de configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/configuration.md).
91
+
92
+ ### Étape 3 : Intégrer Intlayer dans votre configuration Astro
93
+
94
+ Ajoutez le plugin intlayer dans votre configuration.
95
+
96
+ ```typescript fileName="astro.config.ts"
97
+ // @ts-check
98
+
99
+ import { intlayer } from "astro-intlayer";
100
+ import { defineConfig } from "astro/config";
101
+
102
+ // https://astro.build/config
103
+ export default defineConfig({
104
+ integrations: [intlayer()],
105
+ });
106
+ ```
107
+
108
+ > Le plugin d'intégration `intlayer()` pour Astro est utilisé pour intégrer Intlayer avec Astro. Il assure la construction des fichiers de déclaration de contenu et les surveille en mode développement. Il définit les variables d'environnement Intlayer au sein de l'application Astro. De plus, il fournit des alias pour optimiser les performances.
109
+
110
+ ### Étape 4 : Déclarez votre contenu
111
+
112
+ Créez et gérez vos déclarations de contenu pour stocker les traductions :
113
+
114
+ ```tsx fileName="src/app.content.tsx"
115
+ import { t, type Dictionary } from "intlayer";
116
+ import type { ReactNode } from "react";
117
+
118
+ const appContent = {
119
+ key: "app",
120
+ content: {
121
+ title: t({
122
+ en: "Hello World",
123
+ fr: "Bonjour le monde",
124
+ es: "Hola mundo",
125
+ }),
126
+ },
127
+ } satisfies Dictionary;
128
+
129
+ export default appContent;
130
+ ```
131
+
132
+ > Vos déclarations de contenu peuvent être définies n'importe où dans votre application dès lors qu'elles sont incluses dans le répertoire `contentDir` (par défaut, `./src`). Et qu'elles correspondent à l'extension des fichiers de déclaration de contenu (par défaut, `.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}`).
133
+
134
+ > Pour plus de détails, référez-vous à la [documentation sur la déclaration de contenu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/get_started.md).
135
+
136
+ ### Étape 5 : Utilisez votre contenu dans Astro
137
+
138
+ Vous pouvez consommer les dictionnaires directement dans les fichiers `.astro` en utilisant les helpers principaux exportés par `intlayer`.
139
+
140
+ ```astro fileName="src/pages/index.astro"
141
+ <!-- astro -->
142
+ ---
143
+ import { getIntlayer } from "intlayer";
144
+ import appContent from "../app.content";
145
+
146
+ const { title } = getIntlayer('app');
147
+ ---
148
+
149
+ <html lang="en">
150
+ <head>
151
+ <meta charset="utf-8" />
152
+ <meta name="viewport" content="width=device-width" />
153
+ <title>{title}</title>
154
+ </head>
155
+ <body>
156
+ <h1>{title}</h1>
157
+ </body>
158
+ </html>
159
+ ```
160
+
161
+ ### Étape 6 : Routage localisé
162
+
163
+ Créez un segment de route dynamique pour servir des pages localisées, par exemple `src/pages/[locale]/index.astro` :
164
+
165
+ ```astro fileName="src/pages/[locale]/index.astro"
166
+ <!-- astro -->
167
+ ---
168
+ import { getIntlayer } from "intlayer";
169
+
170
+ const { title } = getIntlayer('app');
171
+ ---
172
+
173
+ <h1>{title}</h1>
174
+ ```
175
+
176
+ L'intégration Astro ajoute un middleware Vite pendant le développement qui facilite le routage sensible à la locale et les définitions d'environnement. Vous pouvez toujours créer des liens entre les locales en utilisant votre propre logique, ou des fonctions utilitaires comme `getLocalizedUrl` de `intlayer`.
177
+
178
+ ### Étape 7 : Continuez à utiliser votre framework préféré
179
+
180
+ Continuez à utiliser votre framework préféré pour construire votre application.
181
+
182
+ - Intlayer + React : [Intlayer avec React](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_with_vite+react.md)
183
+ - Intlayer + Vue : [Intlayer avec Vue](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_with_vite+vue.md)
184
+ - Intlayer + Svelte : [Intlayer avec Svelte](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_with_vite+svelte.md)
185
+ - Intlayer + Solid : [Intlayer avec Solid](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_with_vite+solid.md)
186
+ - Intlayer + Preact : [Intlayer avec Preact](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_with_vite+preact.md)
187
+
188
+ ### Configurer TypeScript
189
+
190
+ Intlayer utilise l'augmentation de module pour bénéficier de TypeScript et renforcer votre base de code.
191
+
192
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
193
+
194
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
195
+
196
+ Assurez-vous que votre configuration TypeScript inclut les types générés automatiquement.
197
+
198
+ ```json5 fileName="tsconfig.json"
199
+ {
200
+ // ... Vos configurations TypeScript existantes
201
+ "include": [
202
+ // ... Vos configurations TypeScript existantes
203
+ ".intlayer/**/*.ts", // Inclure les types générés automatiquement
204
+ ],
205
+ }
206
+ ```
207
+
208
+ ### Configuration Git
209
+
210
+ Il est recommandé d'ignorer les fichiers générés par Intlayer. Cela vous permet d'éviter de les commettre dans votre dépôt Git.
211
+
212
+ Pour ce faire, vous pouvez ajouter les instructions suivantes à votre fichier `.gitignore` :
213
+
214
+ ```plaintext
215
+ # Ignorer les fichiers générés par Intlayer
216
+ .intlayer
217
+ ```
218
+
219
+ ### Extension VS Code
220
+
221
+ Pour améliorer votre expérience de développement avec Intlayer, vous pouvez installer l'extension officielle **Intlayer VS Code Extension**.
222
+
223
+ [Installer depuis le Marketplace VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
224
+
225
+ Cette extension offre :
226
+
227
+ - **Autocomplétion** pour les clés de traduction.
228
+ - **Détection d'erreurs en temps réel** pour les traductions manquantes.
229
+ - **Aperçus en ligne** du contenu traduit.
230
+ - **Actions rapides** pour créer et mettre à jour facilement les traductions.
231
+
232
+ Pour plus de détails sur l'utilisation de l'extension, consultez la [documentation de l'extension Intlayer VS Code](https://intlayer.org/doc/vs-code-extension).
233
+
234
+ ---
235
+
236
+ ### Aller plus loin
237
+
238
+ Pour aller plus loin, vous pouvez implémenter l’[éditeur visuel](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_visual_editor.md) ou externaliser votre contenu en utilisant le [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_CMS.md).
239
+
240
+ ---
241
+
242
+ ## Historique de la documentation
243
+
244
+ | Version | Date | Modifications |
245
+ | ------- | ---------- | ---------------------------------------------------------------- |
246
+ | 6.2.0 | 2025-10-03 | Mise à jour pour l’intégration Astro, configuration, utilisation |
@@ -1152,9 +1152,10 @@ En appliquant ces modifications, votre application :
1152
1152
 
1153
1153
  Intlayer utilise l'augmentation de module pour bénéficier de TypeScript et renforcer votre base de code.
1154
1154
 
1155
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1155
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1156
+
1157
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1156
1158
 
1157
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1158
1159
  Assurez-vous que votre configuration TypeScript inclut les types générés automatiquement.
1159
1160
 
1160
1161
  ```json5 fileName="tsconfig.json"
@@ -361,9 +361,9 @@ Par défaut, `express-intlayer` interprétera l'en-tête `Accept-Language` pour
361
361
 
362
362
  `express-intlayer` exploite les puissantes capacités de TypeScript pour améliorer le processus d'internationalisation. Le typage statique de TypeScript garantit que chaque clé de traduction est prise en compte, réduisant ainsi le risque de traductions manquantes et améliorant la maintenabilité.
363
363
 
364
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
364
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
365
365
 
366
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
366
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
367
367
 
368
368
  Assurez-vous que les types générés automatiquement (par défaut dans ./types/intlayer.d.ts) sont inclus dans votre fichier tsconfig.json.
369
369
 
@@ -219,9 +219,9 @@ Par défaut, `express-intlayer` interprétera l'en-tête `Accept-Language` pour
219
219
 
220
220
  `express-intlayer` exploite les puissantes capacités de TypeScript pour améliorer le processus d'internationalisation. Le typage statique de TypeScript garantit que chaque clé de traduction est prise en compte, réduisant ainsi le risque de traductions manquantes et améliorant la maintenabilité.
221
221
 
222
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
222
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
223
223
 
224
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
224
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
225
225
 
226
226
  Assurez-vous que les types générés automatiquement (par défaut dans ./types/intlayer.d.ts) sont inclus dans votre fichier tsconfig.json.
227
227
 
@@ -1235,9 +1235,9 @@ yarn add @intlayer/swc --save-dev
1235
1235
 
1236
1236
  Intlayer utilise l'augmentation de module pour bénéficier de TypeScript et renforcer votre base de code.
1237
1237
 
1238
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1238
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1239
1239
 
1240
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1240
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1241
1241
 
1242
1242
  Assurez-vous que votre configuration TypeScript inclut les types générés automatiquement.
1243
1243
 
@@ -149,28 +149,25 @@ module.exports = (async () => {
149
149
 
150
150
  ## Étape 4 : Ajouter le fournisseur Intlayer
151
151
 
152
- Pour garder la langue de l'utilisateur synchronisée dans toute votre application, vous devez envelopper votre composant racine avec le composant `IntlayerProvider` provenant de `react-intlayer`.
152
+ Pour garder synchronisée la langue de l'utilisateur dans toute votre application, vous devez envelopper votre composant racine avec le composant `IntlayerProvider` de `react-intlayer-native`.
153
153
 
154
- De plus, vous devez ajouter la fonction `intlayerPolyfill` dans votre fichier `index.js` pour garantir que Intlayer fonctionne correctement.
154
+ > Assurez-vous d'utiliser le fournisseur de `react-native-intlayer` au lieu de `react-intlayer`. L'export de `react-native-intlayer` inclut des polyfills pour l'API web.
155
155
 
156
156
  ```tsx fileName="app/_layout.tsx" codeFormat="typescript"
157
157
  import { Stack } from "expo-router";
158
158
  import { getLocales } from "expo-localization";
159
- import { IntlayerProviderContent } from "react-intlayer";
160
- import { intlayerPolyfill } from "react-native-intlayer";
159
+ import { IntlayerProvider } from "react-native-intlayer";
161
160
  import { type FC } from "react";
162
161
 
163
- intlayerPolyfill();
164
-
165
162
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
166
163
 
167
164
  const RootLayout: FC = () => {
168
165
  return (
169
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
166
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
170
167
  <Stack>
171
168
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
172
169
  </Stack>
173
- </IntlayerProviderContent>
170
+ </IntlayerProvider>
174
171
  );
175
172
  };
176
173
 
@@ -180,20 +177,17 @@ export default RootLayout;
180
177
  ```jsx fileName="app/_layout.mjx" codeFormat="esm"
181
178
  import { Stack } from "expo-router";
182
179
  import { getLocales } from "expo-localization";
183
- import { IntlayerProviderContent } from "react-intlayer";
184
- import { intlayerPolyfill } from "react-native-intlayer";
185
-
186
- intlayerPolyfill();
180
+ import { IntlayerProvider } from "react-native-intlayer";
187
181
 
188
182
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
189
183
 
190
184
  const RootLayout = () => {
191
185
  return (
192
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
186
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
193
187
  <Stack>
194
188
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
195
189
  </Stack>
196
- </IntlayerProviderContent>
190
+ </IntlayerProvider>
197
191
  );
198
192
  };
199
193
 
@@ -203,20 +197,17 @@ export default RootLayout;
203
197
  ```jsx fileName="app/_layout.cjx" codeFormat="commonjs"
204
198
  const { Stack } = require("expo-router");
205
199
  const { getLocales } = require("expo-localization");
206
- const { IntlayerProviderContent } = require("react-intlayer");
207
- const { intlayerPolyfill } = require("react-native-intlayer");
208
-
209
- intlayerPolyfill();
200
+ const { IntlayerProvider } = require("react-native-intlayer");
210
201
 
211
202
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
212
203
 
213
204
  const RootLayout = () => {
214
205
  return (
215
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
206
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
216
207
  <Stack>
217
208
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
218
209
  </Stack>
219
- </IntlayerProviderContent>
210
+ </IntlayerProvider>
220
211
  );
221
212
  };
222
213