@intlayer/docs 5.7.8 → 5.8.0
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.
- package/blog/ar/intlayer_with_next-i18next.md +5 -6
- package/blog/ar/intlayer_with_next-intl.md +3 -4
- package/blog/ar/intlayer_with_react-i18next.md +1 -1
- package/blog/ar/intlayer_with_react-intl.md +1 -1
- package/blog/ar/next-i18next_vs_next-intl_vs_intlayer.md +96 -219
- package/blog/ar/react-i18next_vs_react-intl_vs_intlayer.md +88 -129
- package/blog/ar/vue-i18n_vs_intlayer.md +268 -0
- package/blog/de/intlayer_with_next-i18next.md +5 -6
- package/blog/de/intlayer_with_react-intl.md +1 -1
- package/blog/de/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
- package/blog/de/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/de/vue-i18n_vs_intlayer.md +268 -0
- package/blog/en/intlayer_with_next-i18next.md +5 -6
- package/blog/en/intlayer_with_next-intl.md +3 -4
- package/blog/en/intlayer_with_react-i18next.md +1 -1
- package/blog/en/intlayer_with_react-intl.md +1 -1
- package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +89 -220
- package/blog/en/react-i18next_vs_react-intl_vs_intlayer.md +85 -123
- package/blog/en/vue-i18n_vs_intlayer.md +268 -0
- package/blog/en-GB/intlayer_with_next-i18next.md +5 -6
- package/blog/en-GB/intlayer_with_next-intl.md +3 -4
- package/blog/en-GB/intlayer_with_react-i18next.md +1 -1
- package/blog/en-GB/intlayer_with_react-intl.md +1 -1
- package/blog/en-GB/next-i18next_vs_next-intl_vs_intlayer.md +85 -218
- package/blog/en-GB/react-i18next_vs_react-intl_vs_intlayer.md +80 -130
- package/blog/en-GB/vue-i18n_vs_intlayer.md +258 -0
- package/blog/es/intlayer_with_next-i18next.md +5 -6
- package/blog/es/intlayer_with_next-intl.md +3 -4
- package/blog/es/intlayer_with_react-i18next.md +1 -1
- package/blog/es/intlayer_with_react-intl.md +1 -1
- package/blog/es/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
- package/blog/es/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/es/vue-i18n_vs_intlayer.md +268 -0
- package/blog/fr/intlayer_with_next-i18next.md +5 -6
- package/blog/fr/intlayer_with_next-intl.md +3 -4
- package/blog/fr/intlayer_with_react-i18next.md +1 -1
- package/blog/fr/intlayer_with_react-intl.md +1 -1
- package/blog/fr/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
- package/blog/fr/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
- package/blog/fr/vue-i18n_vs_intlayer.md +269 -0
- package/blog/hi/intlayer_with_next-i18next.md +5 -6
- package/blog/hi/intlayer_with_next-intl.md +3 -4
- package/blog/hi/intlayer_with_react-i18next.md +1 -1
- package/blog/hi/intlayer_with_react-intl.md +1 -1
- package/blog/hi/next-i18next_vs_next-intl_vs_intlayer.md +97 -220
- package/blog/hi/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
- package/blog/hi/vue-i18n_vs_intlayer.md +268 -0
- package/blog/it/intlayer_with_next-i18next.md +5 -6
- package/blog/it/intlayer_with_next-intl.md +3 -4
- package/blog/it/intlayer_with_react-i18next.md +1 -1
- package/blog/it/intlayer_with_react-intl.md +1 -1
- package/blog/it/next-i18next_vs_next-intl_vs_intlayer.md +91 -214
- package/blog/it/react-i18next_vs_react-intl_vs_intlayer.md +86 -127
- package/blog/it/vue-i18n_vs_intlayer.md +268 -0
- package/blog/ja/intlayer_with_next-i18next.md +5 -6
- package/blog/ja/intlayer_with_next-intl.md +3 -4
- package/blog/ja/intlayer_with_react-intl.md +1 -1
- package/blog/ja/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
- package/blog/ja/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/ja/vue-i18n_vs_intlayer.md +268 -0
- package/blog/ko/intlayer_with_next-i18next.md +5 -6
- package/blog/ko/intlayer_with_next-intl.md +3 -4
- package/blog/ko/intlayer_with_react-intl.md +1 -1
- package/blog/ko/next-i18next_vs_next-intl_vs_intlayer.md +95 -217
- package/blog/ko/react-i18next_vs_react-intl_vs_intlayer.md +89 -130
- package/blog/ko/vue-i18n_vs_intlayer.md +268 -0
- package/blog/pt/intlayer_with_next-i18next.md +5 -6
- package/blog/pt/intlayer_with_next-intl.md +3 -4
- package/blog/pt/intlayer_with_react-intl.md +1 -1
- package/blog/pt/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
- package/blog/pt/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/pt/vue-i18n_vs_intlayer.md +268 -0
- package/blog/ru/intlayer_with_next-i18next.md +5 -6
- package/blog/ru/intlayer_with_next-intl.md +3 -4
- package/blog/ru/intlayer_with_react-i18next.md +1 -1
- package/blog/ru/intlayer_with_react-intl.md +1 -1
- package/blog/ru/next-i18next_vs_next-intl_vs_intlayer.md +94 -217
- package/blog/ru/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/ru/vue-i18n_vs_intlayer.md +268 -0
- package/blog/zh/intlayer_with_next-i18next.md +5 -6
- package/blog/zh/intlayer_with_next-intl.md +3 -4
- package/blog/zh/intlayer_with_react-i18next.md +1 -1
- package/blog/zh/intlayer_with_react-intl.md +1 -1
- package/blog/zh/next-i18next_vs_next-intl_vs_intlayer.md +93 -216
- package/blog/zh/react-i18next_vs_react-intl_vs_intlayer.md +87 -128
- package/blog/zh/vue-i18n_vs_intlayer.md +269 -0
- package/dist/cjs/generated/blog.entry.cjs +41 -0
- package/dist/cjs/generated/blog.entry.cjs.map +1 -1
- package/dist/cjs/generated/docs.entry.cjs +41 -0
- package/dist/cjs/generated/docs.entry.cjs.map +1 -1
- package/dist/esm/generated/blog.entry.mjs +41 -0
- package/dist/esm/generated/blog.entry.mjs.map +1 -1
- package/dist/esm/generated/docs.entry.mjs +41 -0
- package/dist/esm/generated/docs.entry.mjs.map +1 -1
- package/dist/types/generated/blog.entry.d.ts +1 -0
- package/dist/types/generated/blog.entry.d.ts.map +1 -1
- package/dist/types/generated/docs.entry.d.ts +1 -0
- package/dist/types/generated/docs.entry.d.ts.map +1 -1
- package/docs/ar/formatters.md +625 -0
- package/docs/ar/how_works_intlayer.md +2 -4
- package/docs/ar/interest_of_intlayer.md +159 -49
- package/docs/ar/intlayer_CMS.md +2 -3
- package/docs/ar/intlayer_visual_editor.md +2 -3
- package/docs/ar/intlayer_with_tanstack.md +1 -1
- package/docs/ar/introduction.md +7 -7
- package/docs/ar/packages/intlayer/index.md +3 -3
- package/docs/ar/packages/next-intlayer/index.md +3 -3
- package/docs/de/formatters.md +649 -0
- package/docs/de/interest_of_intlayer.md +161 -47
- package/docs/de/introduction.md +5 -5
- package/docs/de/packages/intlayer/index.md +3 -3
- package/docs/de/packages/next-intlayer/index.md +3 -3
- package/docs/de/packages/react-intlayer/index.md +3 -3
- package/docs/en/dictionary/enumeration.md +2 -2
- package/docs/en/dictionary/function_fetching.md +2 -2
- package/docs/en/dictionary/get_started.md +2 -2
- package/docs/en/dictionary/translation.md +2 -2
- package/docs/en/formatters.md +618 -0
- package/docs/en/how_works_intlayer.md +2 -4
- package/docs/en/interest_of_intlayer.md +170 -46
- package/docs/en/intlayer_CMS.md +2 -3
- package/docs/en/intlayer_visual_editor.md +2 -3
- package/docs/en/intlayer_with_create_react_app.md +2 -2
- package/docs/en/intlayer_with_express.md +2 -2
- package/docs/en/intlayer_with_tanstack.md +1 -1
- package/docs/en/introduction.md +7 -7
- package/docs/en/packages/express-intlayer/index.md +2 -2
- package/docs/en/packages/intlayer/getConfiguration.md +2 -3
- package/docs/en/packages/intlayer/getEnumeration.md +2 -7
- package/docs/en/packages/intlayer/getHTMLTextDir.md +2 -4
- package/docs/en/packages/intlayer/getLocaleLang.md +2 -4
- package/docs/en/packages/intlayer/getLocaleName.md +2 -3
- package/docs/en/packages/intlayer/getLocalizedUrl.md +2 -8
- package/docs/en/packages/intlayer/getMultilingualUrls.md +2 -7
- package/docs/en/packages/intlayer/getPathWithoutLocale.md +2 -3
- package/docs/en/packages/intlayer/getTranslation.md +2 -4
- package/docs/en/packages/intlayer/index.md +5 -5
- package/docs/en/packages/next-intlayer/index.md +5 -5
- package/docs/en/packages/next-intlayer/t.md +2 -2
- package/docs/en/packages/next-intlayer/useDictionary.md +2 -2
- package/docs/en/packages/next-intlayer/useIntlayer.md +2 -2
- package/docs/en/packages/next-intlayer/useLocale.md +2 -2
- package/docs/en/packages/react-intlayer/index.md +5 -5
- package/docs/en/packages/react-intlayer/t.md +2 -2
- package/docs/en/packages/react-intlayer/useI18n.md +2 -2
- package/docs/en/packages/react-intlayer/useIntlayer.md +2 -2
- package/docs/en/packages/react-intlayer/useLocale.md +2 -2
- package/docs/en/packages/react-scripts-intlayer/index.md +2 -2
- package/docs/en/packages/solid-intlayer/index.md +2 -2
- package/docs/en/packages/vite-intlayer/index.md +2 -2
- package/docs/en-GB/formatters.md +625 -0
- package/docs/en-GB/how_works_intlayer.md +2 -4
- package/docs/en-GB/interest_of_intlayer.md +157 -53
- package/docs/en-GB/intlayer_with_tanstack.md +1 -1
- package/docs/en-GB/introduction.md +2 -2
- package/docs/en-GB/packages/intlayer/index.md +3 -3
- package/docs/en-GB/packages/next-intlayer/index.md +3 -3
- package/docs/en-GB/packages/react-intlayer/index.md +3 -3
- package/docs/es/formatters.md +649 -0
- package/docs/es/how_works_intlayer.md +2 -4
- package/docs/es/interest_of_intlayer.md +156 -47
- package/docs/es/intlayer_with_tanstack.md +1 -1
- package/docs/es/introduction.md +5 -5
- package/docs/es/packages/intlayer/index.md +3 -3
- package/docs/es/packages/next-intlayer/index.md +3 -3
- package/docs/fr/formatters.md +649 -0
- package/docs/fr/how_works_intlayer.md +2 -4
- package/docs/fr/interest_of_intlayer.md +157 -46
- package/docs/fr/intlayer_with_tanstack.md +1 -1
- package/docs/fr/introduction.md +5 -5
- package/docs/fr/packages/intlayer/index.md +3 -3
- package/docs/fr/packages/next-intlayer/index.md +3 -3
- package/docs/fr/packages/react-intlayer/index.md +3 -3
- package/docs/hi/formatters.md +630 -0
- package/docs/hi/how_works_intlayer.md +2 -4
- package/docs/hi/interest_of_intlayer.md +155 -42
- package/docs/hi/intlayer_with_tanstack.md +1 -1
- package/docs/hi/introduction.md +5 -5
- package/docs/hi/packages/intlayer/index.md +3 -3
- package/docs/hi/packages/next-intlayer/index.md +3 -3
- package/docs/hi/packages/react-intlayer/index.md +3 -3
- package/docs/it/formatters.md +647 -0
- package/docs/it/how_works_intlayer.md +2 -4
- package/docs/it/interest_of_intlayer.md +157 -46
- package/docs/it/intlayer_with_tanstack.md +1 -1
- package/docs/it/introduction.md +5 -5
- package/docs/it/packages/intlayer/index.md +3 -3
- package/docs/it/packages/next-intlayer/index.md +3 -3
- package/docs/it/packages/react-intlayer/index.md +3 -3
- package/docs/ja/formatters.md +649 -0
- package/docs/ja/how_works_intlayer.md +2 -4
- package/docs/ja/interest_of_intlayer.md +154 -48
- package/docs/ja/intlayer_with_tanstack.md +1 -1
- package/docs/ja/introduction.md +5 -5
- package/docs/ja/packages/intlayer/index.md +3 -3
- package/docs/ja/packages/next-intlayer/index.md +3 -3
- package/docs/ja/packages/react-intlayer/index.md +3 -3
- package/docs/ko/formatters.md +649 -0
- package/docs/ko/how_works_intlayer.md +2 -4
- package/docs/ko/interest_of_intlayer.md +157 -48
- package/docs/ko/intlayer_with_tanstack.md +1 -1
- package/docs/ko/introduction.md +5 -5
- package/docs/ko/packages/intlayer/index.md +3 -3
- package/docs/ko/packages/next-intlayer/index.md +3 -3
- package/docs/ko/packages/react-intlayer/index.md +3 -3
- package/docs/pt/formatters.md +625 -0
- package/docs/pt/how_works_intlayer.md +2 -4
- package/docs/pt/interest_of_intlayer.md +162 -47
- package/docs/pt/intlayer_with_tanstack.md +1 -1
- package/docs/pt/introduction.md +5 -5
- package/docs/pt/packages/intlayer/index.md +3 -3
- package/docs/pt/packages/next-intlayer/index.md +3 -3
- package/docs/pt/packages/react-intlayer/index.md +3 -3
- package/docs/ru/autoFill.md +2 -2
- package/docs/ru/configuration.md +1 -40
- package/docs/ru/formatters.md +649 -0
- package/docs/ru/how_works_intlayer.md +5 -7
- package/docs/ru/index.md +1 -1
- package/docs/ru/interest_of_intlayer.md +165 -50
- package/docs/ru/intlayer_CMS.md +7 -8
- package/docs/ru/intlayer_cli.md +4 -7
- package/docs/ru/intlayer_visual_editor.md +5 -6
- package/docs/ru/intlayer_with_angular.md +1 -1
- package/docs/ru/intlayer_with_create_react_app.md +5 -5
- package/docs/ru/intlayer_with_lynx+react.md +1 -1
- package/docs/ru/intlayer_with_nextjs_15.md +3 -3
- package/docs/ru/intlayer_with_nextjs_page_router.md +2 -2
- package/docs/ru/intlayer_with_nuxt.md +1 -1
- package/docs/ru/intlayer_with_react_native+expo.md +2 -2
- package/docs/ru/intlayer_with_tanstack.md +3 -3
- package/docs/ru/intlayer_with_vite+preact.md +3 -3
- package/docs/ru/intlayer_with_vite+react.md +3 -3
- package/docs/ru/intlayer_with_vite+solid.md +1 -1
- package/docs/ru/intlayer_with_vite+svelte.md +1 -1
- package/docs/ru/intlayer_with_vite+vue.md +2 -2
- package/docs/ru/introduction.md +8 -8
- package/docs/ru/locale_mapper.md +1 -1
- package/docs/ru/packages/@intlayer/api/index.md +2 -2
- package/docs/ru/packages/@intlayer/chokidar/index.md +1 -1
- package/docs/ru/packages/@intlayer/cli/index.md +2 -2
- package/docs/ru/packages/@intlayer/config/index.md +2 -2
- package/docs/ru/packages/@intlayer/core/index.md +2 -2
- package/docs/ru/packages/@intlayer/design-system/index.md +2 -2
- package/docs/ru/packages/@intlayer/dictionary-entry/index.md +2 -2
- package/docs/ru/packages/@intlayer/editor/index.md +1 -1
- package/docs/ru/packages/@intlayer/editor-react/index.md +1 -1
- package/docs/ru/packages/@intlayer/webpack/index.md +1 -1
- package/docs/ru/packages/angular-intlayer/index.md +1 -1
- package/docs/ru/packages/express-intlayer/index.md +3 -3
- package/docs/ru/packages/express-intlayer/t.md +1 -1
- package/docs/ru/packages/intlayer/getEnumeration.md +3 -8
- package/docs/ru/packages/intlayer/getTranslation.md +3 -5
- package/docs/ru/packages/intlayer/getTranslationContent.md +1 -3
- package/docs/ru/packages/intlayer/index.md +6 -6
- package/docs/ru/packages/intlayer-cli/index.md +1 -1
- package/docs/ru/packages/intlayer-editor/index.md +2 -2
- package/docs/ru/packages/lynx-intlayer/index.md +1 -1
- package/docs/ru/packages/next-intlayer/index.md +7 -7
- package/docs/ru/packages/next-intlayer/t.md +4 -4
- package/docs/ru/packages/next-intlayer/useLocale.md +3 -3
- package/docs/ru/packages/nuxt-intlayer/index.md +1 -1
- package/docs/ru/packages/preact-intlayer/index.md +1 -1
- package/docs/ru/packages/react-intlayer/index.md +7 -7
- package/docs/ru/packages/react-intlayer/t.md +4 -4
- package/docs/ru/packages/react-native-intlayer/index.md +1 -1
- package/docs/ru/packages/react-scripts-intlayer/index.md +3 -3
- package/docs/ru/packages/solid-intlayer/index.md +3 -3
- package/docs/ru/packages/svelte-intlayer/index.md +1 -1
- package/docs/ru/packages/vite-intlayer/index.md +3 -3
- package/docs/ru/packages/vue-intlayer/index.md +1 -1
- package/docs/ru/per_locale_file.md +1 -1
- package/docs/ru/roadmap.md +3 -5
- package/docs/ru/vs_code_extension.md +1 -1
- package/docs/zh/formatters.md +647 -0
- package/docs/zh/how_works_intlayer.md +2 -4
- package/docs/zh/interest_of_intlayer.md +155 -48
- package/docs/zh/intlayer_with_tanstack.md +1 -1
- package/docs/zh/introduction.md +5 -5
- package/docs/zh/packages/intlayer/index.md +3 -3
- package/docs/zh/packages/next-intlayer/index.md +3 -3
- package/docs/zh/packages/react-intlayer/index.md +3 -3
- package/frequent_questions/ar/domain_routing.md +1 -1
- package/frequent_questions/en/domain_routing.md +1 -1
- package/frequent_questions/en-GB/domain_routing.md +1 -1
- package/frequent_questions/es/domain_routing.md +1 -1
- package/frequent_questions/fr/domain_routing.md +1 -1
- package/frequent_questions/hi/domain_routing.md +1 -1
- package/frequent_questions/it/domain_routing.md +1 -1
- package/frequent_questions/ko/domain_routing.md +1 -1
- package/frequent_questions/pt/domain_routing.md +1 -1
- package/frequent_questions/ru/domain_routing.md +1 -1
- package/frequent_questions/ru/get_locale_cookie.md +4 -4
- package/frequent_questions/ru/static_rendering.md +1 -2
- package/frequent_questions/zh/domain_routing.md +1 -1
- package/package.json +11 -11
- package/src/generated/blog.entry.ts +41 -0
- package/src/generated/docs.entry.ts +41 -0
|
@@ -1,194 +1,153 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2025-01-02
|
|
3
3
|
updatedAt: 2025-06-29
|
|
4
|
-
title: react-
|
|
5
|
-
description: React
|
|
4
|
+
title: react-i18next बनाम react-intl बनाम Intlayer
|
|
5
|
+
description: React ऐप के अंतरराष्ट्रीयकरण (i18n) के लिए react-i18next को next-intl और Intlayer के साथ एकीकृत करें
|
|
6
6
|
keywords:
|
|
7
7
|
- next-intl
|
|
8
8
|
- react-i18next
|
|
9
9
|
- Intlayer
|
|
10
|
-
-
|
|
11
|
-
-
|
|
10
|
+
- अंतरराष्ट्रीयकरण
|
|
11
|
+
- ब्लॉग
|
|
12
12
|
- Next.js
|
|
13
|
-
-
|
|
13
|
+
- जावास्क्रिप्ट
|
|
14
14
|
- React
|
|
15
15
|
slugs:
|
|
16
16
|
- blog
|
|
17
17
|
- react-i18next-vs-react-intl-vs-intlayer
|
|
18
18
|
---
|
|
19
19
|
|
|
20
|
-
#
|
|
20
|
+
# react-Intl बनाम react-i18next बनाम intlayer | React अंतरराष्ट्रीयकरण (i18n)
|
|
21
21
|
|
|
22
|
-
|
|
22
|
+
यह गाइड **React** के लिए तीन स्थापित i18n विकल्पों की तुलना करता है: **react-intl** (FormatJS), **react-i18next** (i18next), और **Intlayer**।
|
|
23
|
+
हम **साधारण React** एप्लिकेशन (जैसे, Vite, CRA, SPA) पर ध्यान केंद्रित करते हैं। यदि आप Next.js का उपयोग कर रहे हैं, तो हमारी समर्पित Next.js तुलना देखें।
|
|
23
24
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
## 1. परिचय
|
|
27
|
-
|
|
28
|
-
React अनुप्रयोगों में अंतर्राष्ट्रीयकरण (i18n) कई तरीकों से प्राप्त किया जा सकता है। यहाँ प्रस्तुत तीन पुस्तकालयों में अलग-अलग डिज़ाइन दर्शन, सुविधाओं का सेट, और सामुदायिक समर्थन है:
|
|
25
|
+
हम मूल्यांकन करते हैं:
|
|
29
26
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
27
|
+
- वास्तुकला और सामग्री संगठन
|
|
28
|
+
- TypeScript और सुरक्षा
|
|
29
|
+
- लापता अनुवाद प्रबंधन
|
|
30
|
+
- समृद्ध सामग्री और स्वरूपण क्षमताएं
|
|
31
|
+
- प्रदर्शन और लोडिंग व्यवहार
|
|
32
|
+
- डेवलपर अनुभव (DX), टूलिंग और रखरखाव
|
|
33
|
+
- SEO/रूटिंग (फ्रेमवर्क-निर्भर)
|
|
33
34
|
|
|
34
|
-
|
|
35
|
+
> **संक्षेप में**: ये तीनों React ऐप को स्थानीयकृत कर सकते हैं। यदि आप चाहते हैं **कंपोनेंट-स्कोप्ड सामग्री**, **सख्त TypeScript प्रकार**, **बिल्ड-टाइम लापता-कुंजी जांच**, **ट्री-शेक्ड शब्दकोश**, और अंतर्निर्मित संपादकीय टूलिंग (विज़ुअल एडिटर/CMS + वैकल्पिक AI अनुवाद), तो **Intlayer** मॉड्यूलर React कोडबेस के लिए सबसे पूर्ण विकल्प है।
|
|
35
36
|
|
|
36
37
|
---
|
|
37
38
|
|
|
38
|
-
##
|
|
39
|
-
|
|
40
|
-
### अवलोकन
|
|
41
|
-
|
|
42
|
-
[**React-Intl**](https://formatjs.io/docs/react-intl/) [FormatJS](https://formatjs.io/) सूट का एक हिस्सा है। यह संदेश स्वरूपण, बहुवचन, दिनांक/समय, और संख्या स्वरूपण को संभालने के लिए **API और घटकों** का एक शक्तिशाली सेट प्रदान करता है। React-Intl का व्यापक रूप से उद्यम अनुप्रयोगों में उपयोग होता है, मुख्य रूप से क्योंकि यह एक पारिस्थितिकी तंत्र का हिस्सा है जो संदेश वाक्यविन्यास और स्वरूपण को मानकीकरण करता है।
|
|
43
|
-
|
|
44
|
-
### प्रमुख सुविधाएँ
|
|
45
|
-
|
|
46
|
-
- **ICU संदेश वाक्यविन्यास**: संदेश अंतःक्रिया, बहुवचन, और अधिक के लिए एक व्यापक वाक्यविन्यास प्रदान करता है।
|
|
47
|
-
- **स्थानीयकृत स्वरूपण**: दिनांक, समय, संख्या, और सापेक्ष समय को स्थानीय अनुसार स्वरूपित करने के लिए निर्मित उपयोगिताएँ।
|
|
48
|
-
- **घोषणाशील घटक**: JSX में निर्बाध उपयोग के लिए `<FormattedMessage>`, `<FormattedNumber>`, `<FormattedDate>`, आदि को प्रकट करता है।
|
|
49
|
-
- **समृद्ध पारिस्थितिकी तंत्र**: संदेश निकालने, प्रबंधन, और संकलन के लिए FormatJS उपकरणों (जैसे, [babel-plugin-react-intl](https://formatjs.io/docs/tooling/babel-plugin/)) के साथ अच्छी तरह से एकीकृत करता है।
|
|
50
|
-
|
|
51
|
-
### सामान्य कार्यप्रणाली
|
|
52
|
-
|
|
53
|
-
1. **संदेश कैटलॉग परिभाषित करें** (आम तौर पर प्रत्येक स्थानीय के लिए JSON फ़ाइलें)।
|
|
54
|
-
2. अपने ऐप को `<IntlProvider locale="en" messages={messages}>` में लपेटें।
|
|
55
|
-
3. `<FormattedMessage id="myMessage" defaultMessage="Hello world" />` का उपयोग करें या अनुवाद स्ट्रिंग्स तक पहुंचने के लिए `useIntl()` हुक का उपयोग करें।
|
|
56
|
-
|
|
57
|
-
### फायदे
|
|
58
|
-
|
|
59
|
-
- अच्छी तरह से स्थापित और कई उत्पादन वातावरणों में उपयोग किया जाता है।
|
|
60
|
-
- बहुवाचन, लिंग, समय क्षेत्र, और अधिक सहित उन्नत संदेश स्वरूपण।
|
|
61
|
-
- संदेश निकालने और संकलन के लिए मजबूत उपकरण समर्थन।
|
|
62
|
-
|
|
63
|
-
### नुकसान
|
|
39
|
+
## उच्च-स्तरीय स्थिति
|
|
64
40
|
|
|
65
|
-
- **ICU
|
|
66
|
-
-
|
|
41
|
+
- **react-intl** - ICU-प्रथम, मानकों के अनुरूप स्वरूपण (तिथियाँ/संख्याएँ/बहुवचन) के साथ एक परिपक्व API। कैटलॉग आमतौर पर केंद्रीकृत होते हैं; कुंजी सुरक्षा और बिल्ड-टाइम सत्यापन मुख्य रूप से आपके जिम्मे होते हैं।
|
|
42
|
+
- **react-i18next** - अत्यंत लोकप्रिय और लचीला; नामस्थान, डिटेक्टर, और कई प्लगइन्स (ICU, बैकएंड)। शक्तिशाली, लेकिन परियोजनाओं के बढ़ने पर कॉन्फ़िगरेशन फैल सकता है।
|
|
43
|
+
- **Intlayer** - React के लिए कंपोनेंट-केंद्रित सामग्री मॉडल, **सख्त TS टाइपिंग**, **बिल्ड-टाइम जांच**, **ट्री-शेकिंग**, साथ ही **विज़ुअल एडिटर/CMS** और **AI-सहायता प्राप्त अनुवाद**। React Router, Vite, CRA आदि के साथ काम करता है।
|
|
67
44
|
|
|
68
45
|
---
|
|
69
46
|
|
|
70
|
-
##
|
|
47
|
+
## फीचर मैट्रिक्स (React फोकस)
|
|
48
|
+
|
|
49
|
+
| फीचर | `react-intlayer` (Intlayer) | `react-i18next` (i18next) | `react-intl` (FormatJS) |
|
|
50
|
+
| --------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- |
|
|
51
|
+
| **कंपोनेंट के पास अनुवाद** | ✅ हाँ, प्रत्येक कंपोनेंट के साथ सामग्री सह-स्थित | ❌ नहीं | ❌ नहीं |
|
|
52
|
+
| **टाइपस्क्रिप्ट एकीकरण** | ✅ उन्नत, स्वचालित रूप से उत्पन्न सख्त प्रकार | ⚠️ बुनियादी; सुरक्षा के लिए अतिरिक्त कॉन्फ़िगरेशन | ✅ अच्छा, लेकिन कम सख्त |
|
|
53
|
+
| **अनुवाद की कमी का पता लगाना** | ✅ टाइपस्क्रिप्ट त्रुटि हाइलाइट और बिल्ड-टाइम त्रुटि/चेतावनी | ⚠️ अधिकांशतः रनटाइम पर फॉलबैक स्ट्रिंग्स | ⚠️ फॉलबैक स्ट्रिंग्स |
|
|
54
|
+
| **समृद्ध सामग्री (JSX/मार्कडाउन/कंपोनेंट्स)** | ✅ प्रत्यक्ष समर्थन | ⚠️ सीमित / केवल इंटरपोलेशन | ⚠️ ICU सिंटैक्स, असली JSX नहीं |
|
|
55
|
+
| **एआई-संचालित अनुवाद** | ✅ हाँ, कई एआई प्रदाताओं का समर्थन करता है। अपने स्वयं के API कुंजी का उपयोग करके उपयोग किया जा सकता है। आपके एप्लिकेशन और सामग्री के संदर्भ को ध्यान में रखता है | ❌ नहीं | ❌ नहीं |
|
|
56
|
+
| **विज़ुअल एडिटर** | ✅ हाँ, स्थानीय विज़ुअल एडिटर + वैकल्पिक CMS; कोडबेस सामग्री को बाहरी रूप से प्रबंधित कर सकता है; एम्बेड करने योग्य | ❌ नहीं / बाहरी स्थानीयकरण प्लेटफार्मों के माध्यम से उपलब्ध | ❌ नहीं / बाहरी स्थानीयकरण प्लेटफार्मों के माध्यम से उपलब्ध |
|
|
57
|
+
| **स्थानीयकृत रूटिंग** | ✅ हाँ, बॉक्स से बाहर स्थानीयकृत पथों का समर्थन करता है (Next.js और Vite के साथ काम करता है) | ⚠️ अंतर्निहित नहीं, प्लगइन्स (जैसे `next-i18next`) या कस्टम राउटर कॉन्फ़िगरेशन की आवश्यकता होती है | ❌ नहीं, केवल संदेश स्वरूपण, रूटिंग मैन्युअल होनी चाहिए |
|
|
58
|
+
| **डायनामिक रूट जनरेशन** | ✅ हाँ | ⚠️ प्लगइन/इकोसिस्टम या मैन्युअल सेटअप | ❌ प्रदान नहीं किया गया |
|
|
59
|
+
| **बहुवचन रूप** | ✅ एनेमरेशन-आधारित पैटर्न | ✅ कॉन्फ़िगर करने योग्य (i18next-icu जैसे प्लगइन्स) | ✅ (ICU) |
|
|
60
|
+
| **स्वरूपण (तिथियाँ, संख्याएँ, मुद्राएँ)** | ✅ अनुकूलित स्वरूपक (अंदर से Intl) | ⚠️ प्लगइन्स या कस्टम Intl उपयोग के माध्यम से | ✅ ICU स्वरूपक |
|
|
61
|
+
| **सामग्री प्रारूप** | ✅ .tsx, .ts, .js, .json, .md, .txt, (.yaml प्रगति पर) | ⚠️ .json | ✅ .json, .js |
|
|
62
|
+
| **ICU समर्थन** | ⚠️ प्रगति पर | ⚠️ प्लगइन के माध्यम से (i18next-icu) | ✅ हाँ |
|
|
63
|
+
| **एसईओ सहायक (hreflang, साइटमैप)** | ✅ अंतर्निर्मित उपकरण: साइटमैप, robots.txt, मेटाडेटा के लिए सहायक | ⚠️ समुदाय प्लगइन्स/मैनुअल | ❌ कोर नहीं |
|
|
64
|
+
| **इकोसिस्टम / समुदाय** | ⚠️ छोटा लेकिन तेजी से बढ़ रहा और प्रतिक्रियाशील | ✅ सबसे बड़ा और परिपक्व | ✅ बड़ा |
|
|
65
|
+
| **सर्वर-साइड रेंडरिंग और सर्वर कंपोनेंट्स** | ✅ हाँ, SSR / React सर्वर कंपोनेंट्स के लिए सुव्यवस्थित | ⚠️ पेज स्तर पर समर्थित लेकिन बच्चों के सर्वर कंपोनेंट्स के लिए कंपोनेंट ट्री पर t-फंक्शंस पास करने की आवश्यकता | ❌ समर्थित नहीं, बच्चों के सर्वर कंपोनेंट्स के लिए कंपोनेंट ट्री पर t-फंक्शंस पास करने की आवश्यकता |
|
|
66
|
+
| **ट्री-शेकिंग (केवल उपयोग की गई सामग्री लोड करें)** | ✅ हाँ, बिल्ड समय पर प्रति-कंपोनेंट Babel/SWC प्लगइन्स के माध्यम से | ⚠️ आमतौर पर सभी लोड करता है (नेमस्पेस/कोड-स्प्लिटिंग के साथ सुधार किया जा सकता है) | ⚠️ आमतौर पर सभी लोड करता है |
|
|
67
|
+
| **लेट लोडिंग** | ✅ हाँ, प्रति-लोकल / प्रति-शब्दकोश | ✅ हाँ (जैसे, मांग पर बैकएंड/नेमस्पेस) | ✅ हाँ (लोकल बंडलों को विभाजित करें) |
|
|
68
|
+
| **अप्रयुक्त सामग्री को हटाना** | ✅ हाँ, बिल्ड समय पर प्रति-शब्दकोश | ❌ नहीं, केवल मैनुअल नेमस्पेस विभाजन के माध्यम से | ❌ नहीं, सभी घोषित संदेश बंडल किए जाते हैं |
|
|
69
|
+
| **बड़े प्रोजेक्ट्स का प्रबंधन** | ✅ मॉड्यूलर को प्रोत्साहित करता है, डिज़ाइन-सिस्टम के लिए उपयुक्त | ⚠️ अच्छी फ़ाइल अनुशासन की आवश्यकता होती है | ⚠️ केंद्रीय कैटलॉग बड़े हो सकते हैं |
|
|
71
70
|
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
[**React-i18next**](https://react.i18next.com/) [i18next](https://www.i18next.com/) का एक React एक्सटेंशन है, जो सबसे लोकप्रिय JavaScript i18n फ्रेमवर्क में से एक है। यह **रनटाइम अनुवादों**, लेज़ी लोडिंग, और भाषा पहचान के लिए **विशेषाधिकारित सुविधाएँ** प्रदान करता है, जिससे यह विभिन्न उपयोग मामलों के लिए अत्यधिक लचीला बनाता है।
|
|
75
|
-
|
|
76
|
-
### प्रमुख सुविधाएँ
|
|
77
|
-
|
|
78
|
-
- **लचीला अनुवाद संरचना**: ICU जैसी एकल स्वरूप में बंधा नहीं है। आप JSON में अनुवाद संग्रह कर सकते हैं, अंतःक्रिया, बहुवचन आदि का उपयोग कर सकते हैं।
|
|
79
|
-
- **गतिशील भाषा स्विचिंग**: इन-बिल्ट भाषा पहचानकर्ता प्लगइन्स और रनटाइम अपडेट।
|
|
80
|
-
- **नस्टेड और संरचित अनुवाद**: आप JSON के भीतर आसानी से अनुवाद नस्ट कर सकते हैं।
|
|
81
|
-
- **विशाल प्लगइन पारिस्थितिकी तंत्र**: पहचान के लिए (ब्राउज़र, पथ, उपडोमेन, आदि), संसाधन लोडिंग, कैशिंग, और अधिक।
|
|
82
|
-
|
|
83
|
-
### सामान्य कार्यप्रणाली
|
|
84
|
-
|
|
85
|
-
1. **`i18next` और `react-i18next` स्थापित करें।**
|
|
86
|
-
2. **अनुवादों (JSON) को लोड करने और भाषा पहचान या फ़ॉलबैक सेट करने के लिए i18n को कॉन्फ़िगर करें।**
|
|
87
|
-
3. अपने ऐप को `I18nextProvider` में लपेटें।
|
|
88
|
-
4. अनुवाद प्रदर्शित करने के लिए `useTranslation()` हुक या `<Trans>` घटक का उपयोग करें।
|
|
71
|
+
---
|
|
89
72
|
|
|
90
|
-
|
|
73
|
+
## गहन तुलना
|
|
91
74
|
|
|
92
|
-
|
|
93
|
-
- बहुत सक्रिय समुदाय और प्लगइन्स का बड़ा पारिस्थितिकी तंत्र।
|
|
94
|
-
- अनुवादों के **गतिशील लोडिंग** की सुविधा (जैसे, सर्वर से, मांग पर)।
|
|
75
|
+
### 1) आर्किटेक्चर और स्केलेबिलिटी
|
|
95
76
|
|
|
96
|
-
|
|
77
|
+
- **react-intl / react-i18next**: अधिकांश सेटअप प्रति भाषा **केंद्रीकृत लोकल फ़ोल्डर** बनाए रखते हैं, कभी-कभी इन्हें **नेमस्पेस** (i18next) द्वारा विभाजित किया जाता है। शुरू में यह अच्छी तरह काम करता है लेकिन जैसे-जैसे ऐप बढ़ते हैं, यह एक साझा सतह बन जाता है।
|
|
78
|
+
- **Intlayer**: प्रत्येक घटक (या प्रत्येक फीचर) के लिए शब्दकोशों को बढ़ावा देता है जो उस UI के साथ **सह-स्थित** होते हैं जिसे वे सेवा देते हैं। इससे स्वामित्व स्पष्ट रहता है, घटकों की नकल/स्थानांतरण आसान होता है, और टीमों के बीच कुंजी परिवर्तन कम होता है। अप्रयुक्त सामग्री की पहचान करना और उसे हटाना आसान होता है।
|
|
97
79
|
|
|
98
|
-
|
|
99
|
-
- यदि आप मजबूत प्रकार के अनुवादों को प्राथमिकता देते हैं, तो आपको अतिरिक्त TypeScript सेटअप की आवश्यकता हो सकती है।
|
|
80
|
+
**महत्व क्यों है:** मॉड्यूलर सामग्री मॉड्यूलर UI का प्रतिबिंब होती है। बड़े React कोडबेस तब साफ-सुथरे रहते हैं जब अनुवाद उन घटकों के साथ रहते हैं जिनसे वे संबंधित हैं।
|
|
100
81
|
|
|
101
82
|
---
|
|
102
83
|
|
|
103
|
-
|
|
84
|
+
### 2) टाइपस्क्रिप्ट और सुरक्षा
|
|
104
85
|
|
|
105
|
-
|
|
86
|
+
- **react-intl**: मजबूत टाइपिंग्स, लेकिन **स्वचालित कुंजी टाइपिंग नहीं**; सुरक्षा पैटर्न आप स्वयं लागू करते हैं।
|
|
87
|
+
- **react-i18next**: हुक्स के लिए मजबूत टाइपिंग्स; **कठोर कुंजी टाइपिंग** आमतौर पर अतिरिक्त कॉन्फ़िगरेशन या जनरेटर की आवश्यकता होती है।
|
|
88
|
+
- **Intlayer**: आपकी सामग्री से **कठोर प्रकारों को स्वचालित रूप से उत्पन्न करता है**। IDE ऑटोकंप्लीट और **कंपाइल-टाइम त्रुटियाँ** रनटाइम से पहले टाइपो और गायब कुंजी पकड़ती हैं।
|
|
106
89
|
|
|
107
|
-
|
|
90
|
+
**महत्व क्यों है:** विफलताओं को **बाएं** (बिल्ड/CI) स्थानांतरित करने से उत्पादन समस्याएँ कम होती हैं और डेवलपर प्रतिक्रिया चक्र तेज़ होता है।
|
|
108
91
|
|
|
109
|
-
|
|
92
|
+
---
|
|
110
93
|
|
|
111
|
-
|
|
112
|
-
- **निर्मित मार्गनिर्देशन और मिडलवेयर**: स्थानीयकृत मार्गनिर्देशन के लिए वैकल्पिक मॉड्यूल (जैसे, `/en/about`, `/fr/about`) और उपयोगकर्ता की स्थानीय पहचान के लिए सर्वर मिडलवेयर।
|
|
113
|
-
- **स्वचालित रूप से जनरेट की गई TypeScript प्रकार**: ऑटोकंप्लीशन और संकलन-समय की त्रुटि पहचान जैसी सुविधाओं के साथ प्रकार की सुरक्षा सुनिश्चित करता है।
|
|
114
|
-
- **गतिशील और समृद्ध अनुवाद**: अनुवाद में JSX/TSX शामिल कर सकते हैं, जिससे अधिक जटिल उपयोग के मामलों (जैसे, लिंक, बोल्ड टेक्स्ट, अनुवाद में आइकन) की अनुमति मिलती है।
|
|
94
|
+
### 3) अनुवाद की कमी को संभालना
|
|
115
95
|
|
|
116
|
-
|
|
96
|
+
- **react-intl / react-i18next**: डिफ़ॉल्ट रूप से **रनटाइम फॉलबैक** (कुंजी की नकल या डिफ़ॉल्ट लोकल) का उपयोग करते हैं। आप लिंटिंग/प्लगइन्स जोड़ सकते हैं, लेकिन यह बिल्ड पर गारंटीकृत नहीं है।
|
|
97
|
+
- **Intlayer**: आवश्यक लोकल/कुंजी गायब होने पर **बिल्ड-टाइम पहचान** के साथ चेतावनी या त्रुटियाँ देता है।
|
|
117
98
|
|
|
118
|
-
|
|
119
|
-
2. **लभ्य स्थानीय और डिफ़ॉल्ट स्थानीय को परिभाषित करने के लिए `intlayer.config.ts` बनाएँ।**
|
|
120
|
-
3. **Intlayer CLI** या प्लगइन का उपयोग करके **सामग्री घोषणाओं को संकलित** करें।
|
|
121
|
-
4. अपने ऐप को `<IntlayerProvider>` में लपेटें और `useIntlayer("keyName")` के साथ सामग्री प्राप्त करें।
|
|
99
|
+
**महत्व क्यों है:** CI में गायब स्ट्रिंग्स पर विफलता गैर-अंग्रेज़ी UI में "रहस्यमय अंग्रेज़ी" के रिसाव को रोकती है।
|
|
122
100
|
|
|
123
|
-
|
|
101
|
+
---
|
|
124
102
|
|
|
125
|
-
|
|
126
|
-
- **समृद्ध सामग्री** संभव (जैसे, अनुवादों के रूप में React नोड्स को पास करना)।
|
|
127
|
-
- **स्थानीयकृत मार्गनिर्देशन** बिना किसी समस्या के।
|
|
128
|
-
- आसान सेटअप के लिए लोकप्रिय निर्माण उपकरणों (CRA, Vite) के साथ एकीकृत।
|
|
103
|
+
### 4) समृद्ध सामग्री और स्वरूपण
|
|
129
104
|
|
|
130
|
-
|
|
105
|
+
- **react-intl**: बहुवचन, चयन, तिथियाँ/संख्याएँ, और संदेश संरचना के लिए उत्कृष्ट **ICU** समर्थन। JSX का उपयोग किया जा सकता है, लेकिन मानसिक मॉडल संदेश-केंद्रित रहता है।
|
|
106
|
+
- **react-i18next**: लचीला इंटरपोलेशन और तत्वों/कंपोनेंट्स को एम्बेड करने के लिए **`<Trans>`**; ICU प्लगइन के माध्यम से उपलब्ध।
|
|
107
|
+
- **Intlayer**: सामग्री फ़ाइलों में **समृद्ध नोड्स** (JSX/Markdown/कंपोनेंट्स) और **मेटाडेटा** शामिल हो सकते हैं। फॉर्मेटिंग अंतर्निहित रूप से Intl का उपयोग करती है; बहुवचन पैटर्न उपयोगकर्ता के अनुकूल हैं।
|
|
131
108
|
|
|
132
|
-
|
|
133
|
-
- "घटक-स्तरीय सामग्री घोषणाओं" पर भारी ध्यान केंद्रित, यह सामान्य .json कैटलॉग से बदलाव हो सकता है।
|
|
134
|
-
- अधिक स्थापित पुस्तकालयों की तुलना में छोटा पारिस्थितिकी तंत्र और समुदाय।
|
|
109
|
+
**महत्व क्यों है:** जटिल UI टेक्स्ट (लिंक, बोल्ड हिस्से, इनलाइन कंपोनेंट्स) तब आसान होते हैं जब लाइब्रेरी React नोड्स को साफ़-सुथरे तरीके से अपनाती है।
|
|
135
110
|
|
|
136
111
|
---
|
|
137
112
|
|
|
138
|
-
|
|
113
|
+
### 5) प्रदर्शन और लोडिंग व्यवहार
|
|
114
|
+
|
|
115
|
+
- **react-intl / react-i18next**: आप आमतौर पर **कैटलॉग विभाजन** और **लेट लोडिंग** को मैन्युअल रूप से प्रबंधित करते हैं (नेमस्पेस/डायनामिक इम्पोर्ट्स)। प्रभावी लेकिन अनुशासन की आवश्यकता होती है।
|
|
116
|
+
- **Intlayer**: उपयोग न किए गए शब्दकोशों को **ट्री-शेक** करता है और **प्रति-शब्दकोश/प्रति-लोकल लेज़ी लोडिंग** को आउट-ऑफ-द-बॉक्स सपोर्ट करता है।
|
|
139
117
|
|
|
140
|
-
|
|
141
|
-
| ------------------------- | ---------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
142
|
-
| **प्राथमिक उपयोग मामला** | स्ट्रिंग-आधारित अनुवाद, दिनांक/संख्या स्वरूपण, ICU संदेश वाक्यविन्यास | पूर्ण-विशेषता वाला i18n सरल गतिशील स्विचिंग, नस्टिंग, प्लगइन पारिस्थितिकी तंत्र | प्रकार- सुरक्षित अनुवादों के साथ घोषणाशील सामग्री, स्थानीयकृत मार्गनिर्देशन, और वैकल्पिक सर्वर मिडलवेयर |
|
|
143
|
-
| **कार्यप्रणाली** | `<IntlProvider>` और FormatJS संदेश घटकों का उपयोग | `I18nextProvider` और `useTranslation()` हुक का उपयोग | `<IntlayerProvider>` और `useIntlayer()` हुक का उपयोग सामग्री घोषणाओं के साथ |
|
|
144
|
-
| **स्थानीयकरण प्रारूप** | ICU-आधारित स्ट्रिंग्स (JSON या JavaScript कैटलॉग) | JSON संसाधन फ़ाइलें (या कस्टम लोडर)। ICU प्रारूप वैकल्पिक i18next प्लगइन के माध्यम से | `.content.[ts/js/tsx]` या JSON घोषणाएँ; इसमें स्ट्रिंग्स या React घटक शामिल हो सकते हैं |
|
|
145
|
-
| **मार्गनिर्देशन** | बाहरी रूप से संभाला जाता है (निर्मित स्थानीयकृत मार्गनिर्देशन नहीं है) | i18next प्लगइन्स (पथ, उपडोमेन पहचान, आदि) के साथ बाहरी रूप से संभाला जाता है | निर्मित स्थानीयकृत मार्गनिर्देशन समर्थन (जैसे, `/en/about`, `/fr/about`), साथ ही वैकल्पिक सर्वर मिडलवेयर (SSR/Vite के लिए) |
|
|
146
|
-
| **TypeScript समर्थन** | अच्छा (आधिकारिक पैकेजों के लिए प्रकार) | अच्छा लेकिन यदि आप सख्त जांच करना चाहते हैं तो टाइप किए गए अनुवादों के लिए अतिरिक्त कॉन्फ़िगरेशन आवश्यक है | उत्कृष्ट (सामग्री कुंजियों और अनुवादों के लिए स्वचालित रूप से जनरेट की गई प्रकार परिभाषाएँ) |
|
|
147
|
-
| **बहुवचन और स्वरूपण** | उन्नत: निर्मित दिनांक/समय/संख्या स्वरूपण, बहुवचन/लिंग समर्थन | कॉन्फ़िगर करने योग्य बहुवचन। दिनांक/समय का स्वरूप आमतौर पर बाहरी पुस्तकालयों या i18next प्लगइन के माध्यम से किया जाता है | मानक JavaScript Intl या सामग्री में तर्क को एम्बेड करने पर निर्भर हो सकता है। FormatJS की तरह विशेषीकृत नहीं है, लेकिन सामान्य मामलों को संभालता है। |
|
|
148
|
-
| **समुदाय & पारिस्थितिकी** | बड़ा, FormatJS पारिस्थितिकी तंत्र का एक हिस्सा | बहुत बड़ा, अत्यधिक सक्रिय, कई प्लगइन्स (पहचान, कैशिंग, ढाँचे) | छोटा लेकिन बढ़ता हुआ; ओपन-सोर्स, आधुनिक दृष्टिकोण |
|
|
149
|
-
| **सीखने का झुकाव** | मध्यम (ICU संदेश वाक्यविन्यास, FormatJS के नियमों को सीखना) | कम से मध्यम (सीधे उपयोग में, लेकिन उन्नत कॉन्फ़िगरेशन verbose हो सकता है) | मध्यम (सामग्री घोषणाओं और विशिष्ट निर्माण चरणों का विचार) |
|
|
118
|
+
**यह क्यों महत्वपूर्ण है:** छोटे बंडल और कम उपयोग न किए गए स्ट्रिंग्स स्टार्टअप और नेविगेशन प्रदर्शन को बेहतर बनाते हैं।
|
|
150
119
|
|
|
151
120
|
---
|
|
152
121
|
|
|
153
|
-
|
|
122
|
+
### 6) DX, टूलिंग और रखरखाव
|
|
154
123
|
|
|
155
|
-
|
|
124
|
+
- **react-intl / react-i18next**: व्यापक समुदाय पारिस्थितिकी तंत्र; संपादकीय वर्कफ़्लो के लिए आप आमतौर पर बाहरी स्थानीयकरण प्लेटफ़ॉर्म अपनाते हैं।
|
|
125
|
+
- **Intlayer**: एक **मुफ्त विज़ुअल एडिटर** और **वैकल्पिक CMS** (सामग्री को Git में रखें या बाहरी रूप से प्रबंधित करें) प्रदान करता है। साथ ही सामग्री लेखन के लिए **VSCode एक्सटेंशन** और आपकी अपनी प्रदाता कुंजियों का उपयोग करके **AI-सहायता प्राप्त अनुवाद** भी उपलब्ध कराता है।
|
|
156
126
|
|
|
157
|
-
|
|
158
|
-
- आप अनुवादों के लिए अधिक “**मानक-आधारित**” दृष्टिकोण को पसंद करते हैं।
|
|
159
|
-
- आपको स्थानीयकृत मार्गनिर्देशन या मजबूत प्रकार के अनुवाद कुंजियों की आवश्यकता नहीं है।
|
|
127
|
+
**महत्व क्यों है:** अंतर्निर्मित उपकरण डेवलपर्स और सामग्री लेखकों के बीच चक्र को छोटा करता है - कम ग्लू कोड, कम विक्रेता निर्भरताएँ।
|
|
160
128
|
|
|
161
|
-
|
|
129
|
+
---
|
|
162
130
|
|
|
163
|
-
|
|
164
|
-
- आप **प्लगइन-आधारित** भाषा पहचान चाहते हैं (जैसे, URL, कुकीज़, स्थानीय संग्रह से) या उन्नत कैशिंग।
|
|
165
|
-
- आपको सबसे बड़े पारिस्थितिकी तंत्र की आवश्यकता है, जिसमें विभिन्न ढाँचों (Next.js, React Native, आदि) के लिए कई मौजूदा एकीकरण हैं।
|
|
131
|
+
## कब किसे चुनें?
|
|
166
132
|
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
- आपको **निर्मित स्थानीयकृत मार्गनिर्देशन** की आवश्यकता है या आप इसे अपने SSR या Vite सेटअप में आसानी से शामिल करना चाहते हैं।
|
|
171
|
-
- आप एक आधुनिक दृष्टिकोण की इच्छा रखते हैं या केवल एक एकल पुस्तकालय चाहते हैं जो दोनों **सामग्री प्रबंधन** (i18n) और **मार्गनिर्देशन** को प्रकार-सुरक्षित तरीके से कवर करता है।
|
|
133
|
+
- **react-intl चुनें** यदि आप एक सरल, मानकों के अनुरूप API के साथ **ICU-प्रथम** संदेश स्वरूपण चाहते हैं और आपकी टीम मैन्युअल रूप से कैटलॉग और सुरक्षा जांच बनाए रखने में सहज है।
|
|
134
|
+
- **react-i18next चुनें** यदि आपको **i18next के व्यापक इकोसिस्टम** (डिटेक्टर, बैकएंड, ICU प्लगइन, एकीकरण) की आवश्यकता है और आप अधिक कॉन्फ़िगरेशन स्वीकार करते हैं ताकि लचीलापन प्राप्त हो सके।
|
|
135
|
+
- **Intlayer चुनें** यदि आप **कंपोनेंट-स्कोप्ड कंटेंट**, **सख्त TypeScript**, **बिल्ड-टाइम गारंटियां**, **ट्री-शेकिंग**, और **बिल्ट-इन** संपादकीय टूलिंग को महत्व देते हैं - खासकर **बड़े, मॉड्यूलर** React ऐप्स के लिए।
|
|
172
136
|
|
|
173
137
|
---
|
|
174
138
|
|
|
175
|
-
##
|
|
176
|
-
|
|
177
|
-
प्रत्येक पुस्तकालय एक React एप्लिकेशन के लिए अंतरराष्ट्रीयकरण का एक मजबूती समाधान प्रदान करता है:
|
|
178
|
-
|
|
179
|
-
- **React-Intl** संदेश स्वरूपण में उत्कृष्टता प्राप्त करता है और ICU संदेश वाक्यविन्यास पर ध्यान केंद्रित करने वाले उद्यम समाधानों के लिए एक लोकप्रिय विकल्प है।
|
|
180
|
-
- **React-i18next** उन्नत या गतिशील i18n आवश्यकताओं के लिए एक अत्यधिक लचीला, प्लगइन-चालित वातावरण प्रदान करता है।
|
|
181
|
-
- **Intlayer** एक **आधुनिक, मजबूत प्रकार** का दृष्टिकोण प्रस्तुत करता है जो सामग्री घोषणाओं, उन्नत स्थानीयकृत मार्गनिर्देशन, और प्लगइन-आधारित (CRA, Vite) एकीकरणों को एकीकृत करता है।
|
|
139
|
+
## व्यावहारिक माइग्रेशन नोट्स (react-intl / react-i18next → Intlayer)
|
|
182
140
|
|
|
183
|
-
|
|
141
|
+
- **क्रमिक रूप से माइग्रेट करें**: एक फीचर या रूट से शुरू करें; संक्रमण के दौरान लेगेसी कैटलॉग्स को समानांतर रखें।
|
|
142
|
+
- **प्रति-कंपोनेंट शब्दकोश अपनाएं**: कंटेंट को कंपोनेंट्स के साथ सह-स्थित करें ताकि कपलिंग कम हो।
|
|
143
|
+
- **सख्त जांच सक्षम करें**: बिल्ड-टाइम त्रुटियों को CI में जल्दी ही गायब कुंजी/लोकल्स दिखाने दें।
|
|
144
|
+
- **बंडल मापें**: अप्रयुक्त स्ट्रिंग्स हटाए जाने पर कमी की उम्मीद करें।
|
|
184
145
|
|
|
185
146
|
---
|
|
186
147
|
|
|
187
|
-
|
|
148
|
+
## निष्कर्ष
|
|
188
149
|
|
|
189
|
-
|
|
190
|
-
- [React-i18next प्रलेखन](https://react.i18next.com/)
|
|
191
|
-
- [Intlayer + CRA शुरू करने के लिए गाइड](#/hi) (आपके दस्तावेज़ से)
|
|
192
|
-
- [Intlayer + Vite & React शुरू करने के लिए गाइड](#/hi) (आपके दस्तावेज़ से)
|
|
150
|
+
तीनों पुस्तकालय React को प्रभावी ढंग से स्थानीयकृत करते हैं। अंतर यह है कि आपको एक **सुरक्षित, स्केलेबल** सेटअप तक पहुंचने के लिए कितना **इन्फ्रास्ट्रक्चर** बनाना होगा:
|
|
193
151
|
|
|
194
|
-
|
|
152
|
+
- **Intlayer** के साथ, **मॉड्यूलर कंटेंट**, **सख्त TS टाइपिंग**, **बिल्ड-टाइम सुरक्षा**, **ट्री-शेकन बंडल**, और **संपादकीय टूलिंग** डिफ़ॉल्ट होते हैं - न कि बोझ।
|
|
153
|
+
- यदि आपकी टीम बहु-स्थानीय, कंपोनेंट-चालित React ऐप्स में **रखरखाव और गति** को महत्व देती है, तो Intlayer आज सबसे **पूर्ण** डेवलपर और कंटेंट वर्कफ़्लो प्रदान करता है।
|