@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
@@ -1105,38 +1105,38 @@ const App = () => (
1105
1105
  module.exports = App;
1106
1106
  ```
1107
1107
 
1108
- 병행하여, `intlayerMiddlewarePlugin`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 플러그인은 사용자의 브라우저 언어 설정을 기준으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
1108
+ 병행하여, `intlayerMiddleware`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 플러그인은 사용자의 브라우저 언어 설정을 기준으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
1109
1109
 
1110
1110
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
1111
1111
  import { defineConfig } from "vite";
1112
1112
  import preact from "@preact/preset-vite";
1113
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1113
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1114
1114
 
1115
1115
  // https://vitejs.dev/config/
1116
1116
  export default defineConfig({
1117
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1117
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1118
1118
  });
1119
1119
  ```
1120
1120
 
1121
1121
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
1122
1122
  import { defineConfig } from "vite";
1123
1123
  import preact from "@preact/preset-vite";
1124
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1124
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1125
1125
 
1126
1126
  // https://vitejs.dev/config/
1127
1127
  export default defineConfig({
1128
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1128
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1129
1129
  });
1130
1130
  ```
1131
1131
 
1132
1132
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
1133
1133
  const { defineConfig } = require("vite");
1134
1134
  const preact = require("@preact/preset-vite");
1135
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
1135
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
1136
1136
 
1137
1137
  // https://vitejs.dev/config/
1138
1138
  module.exports = defineConfig({
1139
- plugins: [preact(), intlayer(), intlayerMiddlewarePlugin()],
1139
+ plugins: [preact(), intlayer(), intlayerMiddleware()],
1140
1140
  });
1141
1141
  ```
1142
1142
 
@@ -1671,9 +1671,9 @@ module.exports = { LocalizedLink, checkIsExternalLink };
1671
1671
 
1672
1672
  Intlayer는 모듈 확장을 사용하여 TypeScript의 이점을 활용하고 코드베이스를 더욱 견고하게 만듭니다.
1673
1673
 
1674
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1674
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1675
1675
 
1676
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1676
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1677
1677
 
1678
1678
  TypeScript 구성에 자동 생성된 타입이 포함되어 있는지 확인하세요.
1679
1679
 
@@ -1006,38 +1006,38 @@ const App = () => (
1006
1006
  );
1007
1007
  ```
1008
1008
 
1009
- 병행하여, `intlayerMiddlewarePlugin`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 플러그인은 사용자의 브라우저 언어 설정을 기반으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
1009
+ 병행하여, `intlayerMiddleware`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 플러그인은 사용자의 브라우저 언어 설정을 기반으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
1010
1010
 
1011
1011
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
1012
1012
  import { defineConfig } from "vite";
1013
1013
  import react from "@vitejs/plugin-react-swc";
1014
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1014
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1015
1015
 
1016
1016
  // https://vitejs.dev/config/
1017
1017
  export default defineConfig({
1018
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1018
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1019
1019
  });
1020
1020
  ```
1021
1021
 
1022
1022
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
1023
1023
  import { defineConfig } from "vite";
1024
1024
  import react from "@vitejs/plugin-react-swc";
1025
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
1025
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
1026
1026
 
1027
1027
  // https://vitejs.dev/config/
1028
1028
  export default defineConfig({
1029
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1029
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1030
1030
  });
1031
1031
  ```
1032
1032
 
1033
1033
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
1034
1034
  const { defineConfig } = require("vite");
1035
1035
  const react = require("@vitejs/plugin-react-swc");
1036
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
1036
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
1037
1037
 
1038
1038
  // https://vitejs.dev/config/
1039
1039
  module.exports = defineConfig({
1040
- plugins: [react(), intlayer(), intlayerMiddlewarePlugin()],
1040
+ plugins: [react(), intlayer(), intlayerMiddleware()],
1041
1041
  });
1042
1042
  ```
1043
1043
 
@@ -1571,9 +1571,9 @@ Link.displayName = "Link";
1571
1571
 
1572
1572
  Intlayer는 모듈 확장을 사용하여 TypeScript의 이점을 활용하고 코드베이스를 더욱 견고하게 만듭니다.
1573
1573
 
1574
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1574
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1575
1575
 
1576
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1576
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1577
1577
 
1578
1578
  TypeScript 구성에 자동 생성된 타입이 포함되어 있는지 확인하세요.
1579
1579
 
@@ -685,46 +685,46 @@ import LocaleSwitcher from "@components/LocaleSwitcher.vue";
685
685
  </template>
686
686
  ```
687
687
 
688
- 동시에, `intlayerMiddlewarePlugin`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 사용자의 브라우저 언어 설정을 기반으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
688
+ 동시에, `intlayerMiddleware`을 사용하여 애플리케이션에 서버 사이드 라우팅을 추가할 수도 있습니다. 이 플러그인은 URL을 기반으로 현재 로케일을 자동으로 감지하고 적절한 로케일 쿠키를 설정합니다. 로케일이 지정되지 않은 경우, 사용자의 브라우저 언어 설정을 기반으로 가장 적합한 로케일을 결정합니다. 로케일이 감지되지 않으면 기본 로케일로 리디렉션합니다.
689
689
 
690
690
  ```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
691
691
  import { defineConfig } from "vite";
692
692
  import vue from "@vitejs/plugin-vue";
693
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
693
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
694
694
 
695
695
  // https://vitejs.dev/config/
696
696
  export default defineConfig({
697
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
697
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
698
698
  });
699
699
  ```
700
700
 
701
701
  ```javascript {3,7} fileName="vite.config.mjs" codeFormat="esm"
702
702
  import { defineConfig } from "vite";
703
703
  import vue from "@vitejs/plugin-vue";
704
- import { intlayer, intlayerMiddlewarePlugin } from "vite-intlayer";
704
+ import { intlayer, intlayerMiddleware } from "vite-intlayer";
705
705
 
706
706
  // https://vitejs.dev/config/
707
707
  export default defineConfig({
708
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
708
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
709
709
  });
710
710
  ```
711
711
 
712
712
  ```javascript {3,7} fileName="vite.config.cjs" codeFormat="commonjs"
713
713
  const { defineConfig } = require("vite");
714
714
  const vue = require("@vitejs/plugin-vue");
715
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
715
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
716
716
 
717
717
  // https://vitejs.dev/config/
718
718
  module.exports = defineConfig({
719
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
719
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
720
720
  });
721
721
  const { defineConfig } = require("vite");
722
722
  const vue = require("@vitejs/plugin-vue");
723
- const { intlayer, intlayerMiddlewarePlugin } = require("vite-intlayer");
723
+ const { intlayer, intlayerMiddleware } = require("vite-intlayer");
724
724
 
725
725
  // https://vitejs.dev/config/
726
726
  module.exports = defineConfig({
727
- plugins: [vue(), intlayer(), intlayerMiddlewarePlugin()],
727
+ plugins: [vue(), intlayer(), intlayerMiddleware()],
728
728
  });
729
729
  ```
730
730
 
@@ -1028,9 +1028,9 @@ const { myMarkdownContent } = useIntlayer("my-component");
1028
1028
 
1029
1029
  Intlayer는 모듈 확장을 사용하여 TypeScript의 이점을 활용하고 코드베이스를 더욱 견고하게 만듭니다.
1030
1030
 
1031
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1031
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1032
1032
 
1033
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1033
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1034
1034
 
1035
1035
  TypeScript 구성에 자동 생성된 타입이 포함되어 있는지 확인하세요.
1036
1036
 
@@ -662,9 +662,9 @@ Para cenários mais complexos, você pode criar um pipe para renderizar o HTML c
662
662
 
663
663
  O Intlayer usa a ampliação de módulos para aproveitar os benefícios do TypeScript e tornar sua base de código mais robusta.
664
664
 
665
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
665
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
666
666
 
667
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
667
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
668
668
 
669
669
  Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente.
670
670
 
@@ -0,0 +1,246 @@
1
+ ---
2
+ createdAt: 2024-03-07
3
+ updatedAt: 2025-10-03
4
+ title: Começando com Intlayer no Astro
5
+ description: Aprenda como adicionar internacionalização (i18n) à sua aplicação Vite e React usando Intlayer. Siga este guia para tornar seu app multilíngue.
6
+ keywords:
7
+ - Internacionalização
8
+ - Documentação
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
+ # Começando a Internacionalizar (i18n) com Intlayer e Astro
22
+
23
+ Veja o [Modelo de Aplicação](https://github.com/aymericzip/intlayer-astro-template) no GitHub.
24
+
25
+ ## O que é Intlayer?
26
+
27
+ **Intlayer** é uma biblioteca inovadora e open-source de internacionalização (i18n) projetada para simplificar o suporte multilíngue em aplicações web modernas.
28
+
29
+ Com o Intlayer, você pode:
30
+
31
+ - **Gerenciar traduções facilmente** usando dicionários declarativos no nível do componente.
32
+ - **Localizar dinamicamente metadados**, rotas e conteúdo.
33
+ - **Garantir suporte ao TypeScript** com tipos autogerados, melhorando o autocompletar e a detecção de erros.
34
+ - **Aproveitar recursos avançados**, como detecção e troca dinâmica de localidade.
35
+
36
+ ---
37
+
38
+ ## Guia Passo a Passo para Configurar o Intlayer no Astro
39
+
40
+ ### Passo 1: Instalar Dependências
41
+
42
+ Instale os pacotes necessários usando seu gerenciador de pacotes:
43
+
44
+ ```bash packageManager="npm"
45
+ npm install intlayer astro-intlayer
46
+ # Opcional: adicionar suporte a React island
47
+ npm install react react-dom react-intlayer @astrojs/react
48
+ ```
49
+
50
+ ```bash packageManager="pnpm"
51
+ pnpm add intlayer astro-intlayer
52
+ # Opcional: adicionar suporte a React island
53
+ pnpm add react react-dom react-intlayer @astrojs/react
54
+ ```
55
+
56
+ ```bash packageManager="yarn"
57
+ yarn add intlayer astro-intlayer
58
+ # Opcional: adicionar suporte a React island
59
+ yarn add react react-dom react-intlayer @astrojs/react
60
+ ```
61
+
62
+ - **intlayer**
63
+ O pacote principal que fornece ferramentas de internacionalização para gerenciamento de configuração, tradução, [declaração de conteúdo](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/dictionary/get_started.md), transpiração e [comandos CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_cli.md).
64
+
65
+ - **astro-intlayer**
66
+ Inclui o plugin de integração do Astro para integrar o Intlayer com o [empacotador Vite](https://vite.dev/guide/why.html#why-bundle-for-production), assim como middleware para detectar o idioma preferido do usuário, gerenciar cookies e lidar com redirecionamento de URL.
67
+
68
+ ### Passo 2: Configuração do seu projeto
69
+
70
+ Crie um arquivo de configuração para configurar os idiomas da sua aplicação:
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
+ // Seus outros idiomas
82
+ ],
83
+ defaultLocale: Locales.ENGLISH,
84
+ },
85
+ };
86
+
87
+ export default config;
88
+ ```
89
+
90
+ > Através deste arquivo de configuração, você pode configurar URLs localizadas, redirecionamento via middleware, nomes de cookies, a localização e extensão das suas declarações de conteúdo, desabilitar logs do Intlayer no console, e muito mais. Para uma lista completa dos parâmetros disponíveis, consulte a [documentação de configuração](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/configuration.md).
91
+
92
+ ### Passo 3: Integre o Intlayer na sua Configuração do Astro
93
+
94
+ Adicione o plugin intlayer na sua configuração.
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
+ > O plugin de integração `intlayer()` para Astro é usado para integrar o Intlayer com o Astro. Ele garante a construção dos arquivos de declaração de conteúdo e os monitora no modo de desenvolvimento. Define variáveis de ambiente do Intlayer dentro da aplicação Astro. Além disso, fornece aliases para otimizar o desempenho.
109
+
110
+ ### Passo 4: Declare Seu Conteúdo
111
+
112
+ Crie e gerencie suas declarações de conteúdo para armazenar traduções:
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
+ > Suas declarações de conteúdo podem ser definidas em qualquer lugar da sua aplicação, desde que estejam incluídas no diretório `contentDir` (por padrão, `./src`). E correspondam à extensão do arquivo de declaração de conteúdo (por padrão, `.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}`).
133
+
134
+ > Para mais detalhes, consulte a [documentação de declaração de conteúdo](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/dictionary/get_started.md).
135
+
136
+ ### Passo 5: Use seu conteúdo no Astro
137
+
138
+ Você pode consumir dicionários diretamente em arquivos `.astro` usando os helpers principais exportados pelo `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
+ ### Passo 6: Roteamento localizado
162
+
163
+ Crie um segmento de rota dinâmica para servir páginas localizadas, por exemplo `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
+ A integração do Astro adiciona um middleware Vite durante o desenvolvimento que ajuda com o roteamento consciente de localidade e definições de ambiente. Você ainda pode criar links entre localidades usando sua própria lógica, ou funções utilitárias como `getLocalizedUrl` do `intlayer`.
177
+
178
+ ### Passo 7: Continue usando seu framework favorito
179
+
180
+ Continue usando seu framework favorito para construir sua aplicação.
181
+
182
+ - Intlayer + React: [Intlayer com React](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_with_vite+react.md)
183
+ - Intlayer + Vue: [Intlayer com Vue](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_with_vite+vue.md)
184
+ - Intlayer + Svelte: [Intlayer com Svelte](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_with_vite+svelte.md)
185
+ - Intlayer + Solid: [Intlayer com Solid](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_with_vite+solid.md)
186
+ - Intlayer + Preact: [Intlayer com Preact](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_with_vite+preact.md)
187
+
188
+ ### Configurar TypeScript
189
+
190
+ Intlayer usa a ampliação de módulos para obter os benefícios do TypeScript e tornar sua base de código mais robusta.
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
+ Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente.
197
+
198
+ ```json5 fileName="tsconfig.json"
199
+ {
200
+ // ... Suas configurações existentes do TypeScript
201
+ "include": [
202
+ // ... Suas configurações existentes do TypeScript
203
+ ".intlayer/**/*.ts", // Inclua os tipos gerados automaticamente
204
+ ],
205
+ }
206
+ ```
207
+
208
+ ### Configuração do Git
209
+
210
+ É recomendado ignorar os arquivos gerados pelo Intlayer. Isso permite evitar que eles sejam commitados no seu repositório Git.
211
+
212
+ Para isso, você pode adicionar as seguintes instruções ao seu arquivo `.gitignore`:
213
+
214
+ ```plaintext
215
+ # Ignorar os arquivos gerados pelo Intlayer
216
+ .intlayer
217
+ ```
218
+
219
+ ### Extensão do VS Code
220
+
221
+ Para melhorar sua experiência de desenvolvimento com o Intlayer, você pode instalar a **Extensão oficial do Intlayer para VS Code**.
222
+
223
+ [Instalar no Marketplace do VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
224
+
225
+ Esta extensão oferece:
226
+
227
+ - **Autocompletar** para chaves de tradução.
228
+ - **Detecção de erros em tempo real** para traduções ausentes.
229
+ - **Visualizações inline** do conteúdo traduzido.
230
+ - **Ações rápidas** para criar e atualizar traduções facilmente.
231
+
232
+ Para mais detalhes sobre como usar a extensão, consulte a [documentação da Extensão Intlayer para VS Code](https://intlayer.org/doc/vs-code-extension).
233
+
234
+ ---
235
+
236
+ ### Ir Além
237
+
238
+ Para ir além, você pode implementar o [editor visual](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_visual_editor.md) ou externalizar seu conteúdo usando o [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/pt/intlayer_CMS.md).
239
+
240
+ ---
241
+
242
+ ## Histórico da Documentação
243
+
244
+ | Versão | Data | Alterações |
245
+ | ------ | ---------- | -------------------------------------------------------- |
246
+ | 6.2.0 | 2025-10-03 | Atualização para integração com Astro, configuração, uso |
@@ -1147,9 +1147,10 @@ Ao aplicar essas alterações, sua aplicação irá:
1147
1147
 
1148
1148
  O Intlayer usa a ampliação de módulos para obter os benefícios do TypeScript e tornar sua base de código mais robusta.
1149
1149
 
1150
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1150
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1151
+
1152
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1151
1153
 
1152
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1153
1154
  Certifique-se de que sua configuração do TypeScript inclua os tipos autogerados.
1154
1155
 
1155
1156
  ```json5 fileName="tsconfig.json"
@@ -368,9 +368,9 @@ Por padrão, o `express-intlayer` interpretará o cabeçalho `Accept-Language` p
368
368
 
369
369
  `express-intlayer` aproveita as robustas capacidades do TypeScript para aprimorar o processo de internacionalização. A tipagem estática do TypeScript garante que cada chave de tradução seja considerada, reduzindo o risco de traduções ausentes e melhorando a manutenção.
370
370
 
371
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
371
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
372
372
 
373
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
373
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
374
374
 
375
375
  Certifique-se de que os tipos autogerados (por padrão em ./types/intlayer.d.ts) estejam incluídos no seu arquivo tsconfig.json.
376
376
 
@@ -222,9 +222,9 @@ Por padrão, o `express-intlayer` interpretará o cabeçalho `Accept-Language` p
222
222
 
223
223
  `express-intlayer` aproveita as robustas capacidades do TypeScript para aprimorar o processo de internacionalização. A tipagem estática do TypeScript garante que cada chave de tradução seja considerada, reduzindo o risco de traduções ausentes e melhorando a manutenção.
224
224
 
225
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
225
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
226
226
 
227
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
227
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
228
228
 
229
229
  Certifique-se de que os tipos autogerados (por padrão em ./types/intlayer.d.ts) estejam incluídos no seu arquivo tsconfig.json.
230
230
 
@@ -1246,9 +1246,9 @@ yarn add @intlayer/swc --save-dev
1246
1246
 
1247
1247
  O Intlayer usa a ampliação de módulos para obter benefícios do TypeScript e tornar sua base de código mais robusta.
1248
1248
 
1249
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1249
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1250
1250
 
1251
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1251
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1252
1252
 
1253
1253
  Certifique-se de que sua configuração do TypeScript inclua os tipos autogerados.
1254
1254
 
@@ -1463,9 +1463,9 @@ yarn add @intlayer/swc --save-dev
1463
1463
 
1464
1464
  O Intlayer utiliza a ampliação de módulos para aproveitar os benefícios do TypeScript e tornar sua base de código mais robusta.
1465
1465
 
1466
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1466
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1467
1467
 
1468
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1468
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1469
1469
 
1470
1470
  Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente.
1471
1471
 
@@ -1466,9 +1466,9 @@ yarn add @intlayer/swc --save-dev
1466
1466
 
1467
1467
  O Intlayer utiliza a ampliação de módulos para aproveitar os benefícios do TypeScript e tornar sua base de código mais robusta.
1468
1468
 
1469
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
1469
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
1470
1470
 
1471
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
1471
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
1472
1472
 
1473
1473
  Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente.
1474
1474
 
@@ -764,9 +764,9 @@ module.exports = aboutMetaContent;
764
764
 
765
765
  O Intlayer usa a ampliação de módulos para aproveitar os benefícios do TypeScript e tornar sua base de código mais robusta.
766
766
 
767
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
767
+ ![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
768
768
 
769
- ![alt text](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
769
+ ![Translation error](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
770
770
 
771
771
  Certifique-se de que sua configuração do TypeScript inclua os tipos gerados automaticamente.
772
772
 
@@ -148,28 +148,25 @@ module.exports = (async () => {
148
148
 
149
149
  ## Passo 4: Adicione o provedor Intlayer
150
150
 
151
- Para manter sincronizado o idioma do usuário em toda a sua aplicação, você precisa envolver seu componente raiz com o componente `IntlayerProvider` do `react-intlayer`.
151
+ Para manter sincronizada a linguagem do usuário em toda a sua aplicação, você precisa envolver seu componente raiz com o componente `IntlayerProvider` do `react-intlayer-native`.
152
152
 
153
- Além disso, você precisa adicionar a função `intlayerPolyfill` ao seu arquivo `index.js` para garantir que o Intlayer funcione corretamente.
153
+ > Certifique-se de usar o provedor do `react-native-intlayer` em vez do `react-intlayer`. A exportação do `react-native-intlayer` inclui polyfills para a API web.
154
154
 
155
155
  ```tsx fileName="app/_layout.tsx" codeFormat="typescript"
156
156
  import { Stack } from "expo-router";
157
157
  import { getLocales } from "expo-localization";
158
- import { IntlayerProviderContent } from "react-intlayer";
159
- import { intlayerPolyfill } from "react-native-intlayer";
158
+ import { IntlayerProvider } from "react-native-intlayer";
160
159
  import { type FC } from "react";
161
160
 
162
- intlayerPolyfill();
163
-
164
161
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
165
162
 
166
163
  const RootLayout: FC = () => {
167
164
  return (
168
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
165
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
169
166
  <Stack>
170
167
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
171
168
  </Stack>
172
- </IntlayerProviderContent>
169
+ </IntlayerProvider>
173
170
  );
174
171
  };
175
172
 
@@ -179,20 +176,17 @@ export default RootLayout;
179
176
  ```jsx fileName="app/_layout.mjx" codeFormat="esm"
180
177
  import { Stack } from "expo-router";
181
178
  import { getLocales } from "expo-localization";
182
- import { IntlayerProviderContent } from "react-intlayer";
183
- import { intlayerPolyfill } from "react-native-intlayer";
184
-
185
- intlayerPolyfill();
179
+ import { IntlayerProvider } from "react-native-intlayer";
186
180
 
187
181
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
188
182
 
189
183
  const RootLayout = () => {
190
184
  return (
191
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
185
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
192
186
  <Stack>
193
187
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
194
188
  </Stack>
195
- </IntlayerProviderContent>
189
+ </IntlayerProvider>
196
190
  );
197
191
  };
198
192
 
@@ -202,20 +196,17 @@ export default RootLayout;
202
196
  ```jsx fileName="app/_layout.cjx" codeFormat="commonjs"
203
197
  const { Stack } = require("expo-router");
204
198
  const { getLocales } = require("expo-localization");
205
- const { IntlayerProviderContent } = require("react-intlayer");
206
- const { intlayerPolyfill } = require("react-native-intlayer");
207
-
208
- intlayerPolyfill();
199
+ const { IntlayerProvider } = require("react-native-intlayer");
209
200
 
210
201
  const getDeviceLocale = () => getLocales()[0]?.languageTag;
211
202
 
212
203
  const RootLayout = () => {
213
204
  return (
214
- <IntlayerProviderContent defaultLocale={getDeviceLocale()}>
205
+ <IntlayerProvider defaultLocale={getDeviceLocale()}>
215
206
  <Stack>
216
207
  <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
217
208
  </Stack>
218
- </IntlayerProviderContent>
209
+ </IntlayerProvider>
219
210
  );
220
211
  };
221
212