@intlayer/docs 5.5.11 → 5.5.12
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-intl.md +0 -1
- package/blog/ar/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/ar/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/ar/what_is_internationalization.md +2 -2
- package/blog/de/intlayer_with_next-intl.md +0 -1
- package/blog/de/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/de/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/de/what_is_internationalization.md +2 -2
- package/blog/en/intlayer_with_next-intl.md +0 -1
- package/blog/en/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/en/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/en/what_is_internationalization.md +2 -2
- package/blog/en-GB/intlayer_with_next-intl.md +0 -1
- package/blog/en-GB/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/en-GB/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/en-GB/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/en-GB/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/en-GB/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/en-GB/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/en-GB/what_is_internationalization.md +2 -2
- package/blog/es/intlayer_with_next-intl.md +0 -1
- package/blog/es/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/es/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/es/what_is_internationalization.md +2 -2
- package/blog/fr/intlayer_with_next-intl.md +0 -1
- package/blog/fr/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/fr/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/fr/what_is_internationalization.md +2 -2
- package/blog/hi/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/hi/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/hi/what_is_internationalization.md +2 -2
- package/blog/it/intlayer_with_next-intl.md +0 -1
- package/blog/it/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/it/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/it/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/it/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/it/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/it/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/it/what_is_internationalization.md +2 -2
- package/blog/ja/intlayer_with_next-intl.md +0 -1
- package/blog/ja/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/ja/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/ja/what_is_internationalization.md +2 -2
- package/blog/ko/intlayer_with_next-intl.md +0 -1
- package/blog/ko/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/ko/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/ko/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/ko/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/ko/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/pt/intlayer_with_next-intl.md +0 -1
- package/blog/pt/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/pt/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/pt/what_is_internationalization.md +2 -2
- package/blog/ru/intlayer_with_next-intl.md +0 -1
- package/blog/ru/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/ru/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/ru/what_is_internationalization.md +2 -2
- package/blog/zh/intlayer_with_next-intl.md +0 -1
- package/blog/zh/list_i18n_technologies/CMS/wordpress.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/angular.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/flutter.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/react-native.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/react.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/svelte.md +1 -1
- package/blog/zh/list_i18n_technologies/frameworks/vue.md +1 -1
- package/blog/zh/what_is_internationalization.md +2 -2
- package/dist/cjs/blog.cjs +2 -2
- package/dist/cjs/blog.cjs.map +1 -1
- package/dist/cjs/common.cjs +17 -6
- package/dist/cjs/common.cjs.map +1 -1
- package/dist/cjs/doc.cjs +2 -2
- package/dist/cjs/doc.cjs.map +1 -1
- package/dist/cjs/frequentQuestions.cjs +2 -2
- package/dist/cjs/frequentQuestions.cjs.map +1 -1
- package/dist/cjs/generated/blog.entry.cjs +1152 -252
- package/dist/cjs/generated/blog.entry.cjs.map +1 -1
- package/dist/cjs/generated/docs.entry.cjs +3778 -1124
- package/dist/cjs/generated/docs.entry.cjs.map +1 -1
- package/dist/cjs/generated/frequentQuestions.entry.cjs +794 -161
- package/dist/cjs/generated/frequentQuestions.entry.cjs.map +1 -1
- package/dist/cjs/generated/legal.entry.cjs +32 -31
- package/dist/cjs/generated/legal.entry.cjs.map +1 -1
- package/dist/cjs/legal.cjs +2 -2
- package/dist/cjs/legal.cjs.map +1 -1
- package/dist/esm/blog.mjs +2 -2
- package/dist/esm/blog.mjs.map +1 -1
- package/dist/esm/common.mjs +17 -6
- package/dist/esm/common.mjs.map +1 -1
- package/dist/esm/doc.mjs +2 -2
- package/dist/esm/doc.mjs.map +1 -1
- package/dist/esm/frequentQuestions.mjs +2 -2
- package/dist/esm/frequentQuestions.mjs.map +1 -1
- package/dist/esm/generated/blog.entry.mjs +1151 -252
- package/dist/esm/generated/blog.entry.mjs.map +1 -1
- package/dist/esm/generated/docs.entry.mjs +3777 -1124
- package/dist/esm/generated/docs.entry.mjs.map +1 -1
- package/dist/esm/generated/frequentQuestions.entry.mjs +793 -161
- package/dist/esm/generated/frequentQuestions.entry.mjs.map +1 -1
- package/dist/esm/generated/legal.entry.mjs +31 -31
- package/dist/esm/generated/legal.entry.mjs.map +1 -1
- package/dist/esm/legal.mjs +2 -2
- package/dist/esm/legal.mjs.map +1 -1
- package/dist/types/blog.d.ts +2 -2
- package/dist/types/blog.d.ts.map +1 -1
- package/dist/types/common.d.ts +3 -2
- package/dist/types/common.d.ts.map +1 -1
- package/dist/types/doc.d.ts +2 -2
- package/dist/types/doc.d.ts.map +1 -1
- package/dist/types/frequentQuestions.d.ts +2 -2
- package/dist/types/frequentQuestions.d.ts.map +1 -1
- package/dist/types/generated/blog.entry.d.ts.map +1 -1
- package/dist/types/generated/docs.entry.d.ts.map +1 -1
- package/dist/types/generated/frequentQuestions.entry.d.ts +1 -0
- package/dist/types/generated/frequentQuestions.entry.d.ts.map +1 -1
- package/dist/types/generated/legal.entry.d.ts.map +1 -1
- package/dist/types/legal.d.ts +2 -2
- package/dist/types/legal.d.ts.map +1 -1
- package/docs/ar/intlayer_with_vite+react.md +100 -108
- package/docs/de/intlayer_with_vite+react.md +121 -142
- package/docs/en/CI_CD.md +3 -1
- package/docs/en/autoFill.md +3 -1
- package/docs/en/configuration.md +4 -1
- package/docs/en/dictionary/condition.md +3 -1
- package/docs/en/dictionary/content_extention_customization.md +3 -1
- package/docs/en/dictionary/enumeration.md +3 -1
- package/docs/en/dictionary/file.md +3 -1
- package/docs/en/dictionary/function_fetching.md +3 -1
- package/docs/en/dictionary/get_started.md +3 -1
- package/docs/en/dictionary/insertion.md +3 -1
- package/docs/en/dictionary/markdown.md +3 -1
- package/docs/en/dictionary/nesting.md +3 -1
- package/docs/en/dictionary/translation.md +3 -1
- package/docs/en/how_works_intlayer.md +3 -1
- package/docs/en/index.md +3 -1
- package/docs/en/interest_of_intlayer.md +3 -1
- package/docs/en/intlayer_CMS.md +3 -1
- package/docs/en/intlayer_cli.md +3 -1
- package/docs/en/intlayer_visual_editor.md +3 -1
- package/docs/en/intlayer_with_angular.md +3 -1
- package/docs/en/intlayer_with_create_react_app.md +3 -1
- package/docs/en/intlayer_with_express.md +3 -1
- package/docs/en/intlayer_with_lynx+react.md +3 -1
- package/docs/en/intlayer_with_nextjs_14.md +6 -1
- package/docs/en/intlayer_with_nextjs_15.md +5 -1
- package/docs/en/intlayer_with_nextjs_page_router.md +5 -1
- package/docs/en/intlayer_with_nuxt.md +3 -1
- package/docs/en/intlayer_with_react_native+expo.md +3 -1
- package/docs/en/intlayer_with_vite+preact.md +3 -1
- package/docs/en/intlayer_with_vite+react.md +9 -7
- package/docs/en/intlayer_with_vite+solid.md +3 -1
- package/docs/en/intlayer_with_vite+svelte.md +3 -1
- package/docs/en/intlayer_with_vite+vue.md +3 -1
- package/docs/en/introduction.md +3 -1
- package/docs/en/mcp_server.md +42 -1
- package/docs/en/packages/@intlayer/api/index.md +3 -1
- package/docs/en/packages/@intlayer/chokidar/index.md +3 -1
- package/docs/en/packages/@intlayer/cli/index.md +3 -1
- package/docs/en/packages/@intlayer/config/index.md +3 -1
- package/docs/en/packages/@intlayer/core/index.md +3 -1
- package/docs/en/packages/@intlayer/design-system/index.md +3 -1
- package/docs/en/packages/@intlayer/dictionary-entry/index.md +3 -1
- package/docs/en/packages/@intlayer/editor/index.md +3 -1
- package/docs/en/packages/@intlayer/editor-react/index.md +3 -1
- package/docs/en/packages/@intlayer/webpack/index.md +3 -1
- package/docs/en/packages/angular-intlayer/index.md +3 -1
- package/docs/en/packages/express-intlayer/index.md +3 -1
- package/docs/en/packages/express-intlayer/t.md +3 -1
- package/docs/en/packages/intlayer/getConfiguration.md +3 -1
- package/docs/en/packages/intlayer/getEnumeration.md +3 -1
- package/docs/en/packages/intlayer/getHTMLTextDir.md +3 -1
- package/docs/en/packages/intlayer/getLocaleLang.md +3 -1
- package/docs/en/packages/intlayer/getLocaleName.md +3 -1
- package/docs/en/packages/intlayer/getLocalizedUrl.md +3 -1
- package/docs/en/packages/intlayer/getMultilingualUrls.md +3 -1
- package/docs/en/packages/intlayer/getPathWithoutLocale.md +3 -1
- package/docs/en/packages/intlayer/getTranslation.md +3 -1
- package/docs/en/packages/intlayer/getTranslationContent.md +3 -1
- package/docs/en/packages/intlayer/index.md +3 -1
- package/docs/en/packages/intlayer-cli/index.md +3 -1
- package/docs/en/packages/intlayer-editor/index.md +3 -1
- package/docs/en/packages/lynx-intlayer/index.md +3 -1
- package/docs/en/packages/next-intlayer/index.md +3 -1
- package/docs/en/packages/next-intlayer/t.md +3 -1
- package/docs/en/packages/next-intlayer/useDictionary.md +3 -1
- package/docs/en/packages/next-intlayer/useIntlayer.md +3 -1
- package/docs/en/packages/next-intlayer/useIntlayerAsync.md +3 -1
- package/docs/en/packages/next-intlayer/useLocale.md +3 -1
- package/docs/en/packages/nuxt-intlayer/index.md +3 -1
- package/docs/en/packages/preact-intlayer/index.md +3 -1
- package/docs/en/packages/react-intlayer/index.md +3 -1
- package/docs/en/packages/react-intlayer/t.md +3 -1
- package/docs/en/packages/react-intlayer/useDictionary.md +3 -1
- package/docs/en/packages/react-intlayer/useIntlayer.md +3 -1
- package/docs/en/packages/react-intlayer/useIntlayerAsync.md +3 -1
- package/docs/en/packages/react-intlayer/useLocale.md +3 -1
- package/docs/en/packages/react-native-intlayer/index.md +3 -1
- package/docs/en/packages/react-scripts-intlayer/index.md +3 -1
- package/docs/en/packages/solid-intlayer/index.md +3 -1
- package/docs/en/packages/svelte-intlayer/index.md +3 -1
- package/docs/en/packages/vite-intlayer/index.md +3 -1
- package/docs/en/packages/vue-intlayer/index.md +3 -1
- package/docs/en/per_locale_file.md +3 -1
- package/docs/en/roadmap.md +5 -2
- package/docs/en/vs_code_extension.md +3 -1
- package/docs/en-GB/intlayer_with_vite+react.md +64 -83
- package/docs/es/intlayer_with_vite+react.md +91 -94
- package/docs/fr/intlayer_with_vite+react.md +73 -65
- package/docs/hi/intlayer_with_vite+react.md +107 -107
- package/docs/it/intlayer_with_vite+react.md +156 -112
- package/docs/ja/intlayer_with_vite+react.md +153 -218
- package/docs/ko/intlayer_with_vite+react.md +116 -148
- package/docs/ko/packages/intlayer/getLocalizedUrl.md +1 -23
- package/docs/pt/intlayer_with_vite+react.md +110 -132
- package/docs/ru/intlayer_with_vite+react.md +98 -83
- package/docs/zh/intlayer_with_vite+react.md +147 -184
- package/docs/zh/packages/intlayer/getLocalizedUrl.md +1 -23
- package/frequent_questions/ar/build_error_CI_CD.md +75 -0
- package/frequent_questions/de/build_error_CI_CD.md +75 -0
- package/frequent_questions/en/build_error_CI_CD.md +75 -0
- package/frequent_questions/en-GB/build_error_CI_CD.md +75 -0
- package/frequent_questions/es/build_error_CI_CD.md +75 -0
- package/frequent_questions/fr/build_error_CI_CD.md +75 -0
- package/frequent_questions/hi/build_error_CI_CD.md +75 -0
- package/frequent_questions/it/build_error_CI_CD.md +75 -0
- package/frequent_questions/ja/build_error_CI_CD.md +75 -0
- package/frequent_questions/ja/intlayer_command_undefined.md +3 -3
- package/frequent_questions/ko/build_error_CI_CD.md +75 -0
- package/frequent_questions/ko/intlayer_command_undefined.md +3 -3
- package/frequent_questions/pt/build_error_CI_CD.md +75 -0
- package/frequent_questions/ru/build_error_CI_CD.md +75 -0
- package/frequent_questions/zh/build_error_CI_CD.md +75 -0
- package/frequent_questions/zh/intlayer_command_undefined.md +3 -3
- package/legal/ar/privacy_notice.md +83 -0
- package/legal/ar/terms_of_service.md +55 -0
- package/legal/de/privacy_notice.md +83 -0
- package/legal/de/terms_of_service.md +55 -0
- package/legal/en/privacy_notice.md +83 -0
- package/legal/en/terms_of_service.md +55 -0
- package/legal/en-GB/privacy_notice.md +83 -0
- package/legal/en-GB/terms_of_service.md +55 -0
- package/legal/es/privacy_notice.md +83 -0
- package/legal/es/terms_of_service.md +55 -0
- package/legal/fr/privacy_notice.md +83 -0
- package/legal/fr/terms_of_service.md +55 -0
- package/legal/hi/privacy_notice.md +83 -0
- package/legal/hi/terms_of_service.md +55 -0
- package/legal/it/privacy_notice.md +83 -0
- package/legal/it/terms_of_service.md +55 -0
- package/legal/ja/privacy_notice.md +83 -0
- package/legal/ja/terms_of_service.md +55 -0
- package/legal/ko/privacy_notice.md +83 -0
- package/legal/ko/terms_of_service.md +55 -0
- package/legal/pt/privacy_notice.md +83 -0
- package/legal/pt/terms_of_service.md +55 -0
- package/legal/ru/privacy_notice.md +83 -0
- package/legal/ru/terms_of_service.md +55 -0
- package/legal/zh/privacy_notice.md +83 -0
- package/legal/zh/terms_of_service.md +55 -0
- package/package.json +7 -6
- package/src/blog.ts +6 -4
- package/src/common.ts +23 -7
- package/src/doc.ts +6 -4
- package/src/frequentQuestions.ts +6 -4
- package/src/generated/blog.entry.ts +1177 -280
- package/src/generated/docs.entry.ts +3868 -1217
- package/src/generated/frequentQuestions.entry.ts +808 -178
- package/src/generated/legal.entry.ts +34 -36
- package/src/legal.ts +6 -4
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
---
|
|
2
|
-
createdAt:
|
|
3
|
-
updatedAt:
|
|
4
|
-
title:
|
|
5
|
-
description: जानें कि
|
|
2
|
+
createdAt: 2024-03-07
|
|
3
|
+
updatedAt: 2024-03-07
|
|
4
|
+
title: Vite + React में Intlayer के साथ शुरुआत करना
|
|
5
|
+
description: जानें कि कैसे Intlayer का उपयोग करके अपने Vite और React एप्लिकेशन में अंतरराष्ट्रीयकरण (i18n) जोड़ें। इस गाइड का पालन करके अपनी ऐप को बहुभाषी बनाएं।
|
|
6
6
|
keywords:
|
|
7
7
|
- अंतरराष्ट्रीयकरण
|
|
8
8
|
- दस्तावेज़ीकरण
|
|
9
9
|
- Intlayer
|
|
10
10
|
- Vite
|
|
11
11
|
- React
|
|
12
|
-
-
|
|
12
|
+
- i18n
|
|
13
13
|
- JavaScript
|
|
14
14
|
slugs:
|
|
15
15
|
- doc
|
|
16
16
|
- environment
|
|
17
|
-
-
|
|
17
|
+
- vite-and-react
|
|
18
18
|
---
|
|
19
19
|
|
|
20
|
-
# Intlayer
|
|
20
|
+
# Intlayer और Vite और React के साथ अंतरराष्ट्रीयकरण (i18n) शुरू करना
|
|
21
21
|
|
|
22
22
|
GitHub पर [एप्लिकेशन टेम्पलेट](https://github.com/aymericzip/intlayer-vite-react-template) देखें।
|
|
23
23
|
|
|
@@ -27,9 +27,9 @@ GitHub पर [एप्लिकेशन टेम्पलेट](https://git
|
|
|
27
27
|
|
|
28
28
|
Intlayer के साथ, आप कर सकते हैं:
|
|
29
29
|
|
|
30
|
-
- **घोषणात्मक शब्दकोशों का उपयोग
|
|
31
|
-
-
|
|
32
|
-
-
|
|
30
|
+
- **घोषणात्मक शब्दकोशों का उपयोग करके** कंपोनेंट स्तर पर अनुवादों का आसानी से प्रबंधन करें।
|
|
31
|
+
- **मेटाडेटा**, रूट्स, और सामग्री को गतिशील रूप से स्थानीयकृत करें।
|
|
32
|
+
- **स्वचालित रूप से उत्पन्न प्रकारों के साथ TypeScript समर्थन सुनिश्चित करें**, जिससे ऑटोकम्प्लीशन और त्रुटि पहचान में सुधार होता है।
|
|
33
33
|
- **उन्नत सुविधाओं का लाभ उठाएं**, जैसे गतिशील लोकल डिटेक्शन और स्विचिंग।
|
|
34
34
|
|
|
35
35
|
---
|
|
@@ -63,7 +63,7 @@ yarn add --save-dev vite-intlayer
|
|
|
63
63
|
वह पैकेज जो Intlayer को React एप्लिकेशन के साथ एकीकृत करता है। यह React अंतरराष्ट्रीयकरण के लिए संदर्भ प्रदाता और हुक्स प्रदान करता है।
|
|
64
64
|
|
|
65
65
|
- **vite-intlayer**
|
|
66
|
-
|
|
66
|
+
Vite प्लगइन शामिल करता है जो Intlayer को [Vite बंडलर](https://vite.dev/guide/why.html#why-bundle-for-production) के साथ एकीकृत करता है, साथ ही उपयोगकर्ता की पसंदीदा लोकल का पता लगाने, कुकीज़ प्रबंधित करने, और URL पुनर्निर्देशन को संभालने के लिए मिडलवेयर भी प्रदान करता है।
|
|
67
67
|
|
|
68
68
|
### चरण 2: अपने प्रोजेक्ट का कॉन्फ़िगरेशन
|
|
69
69
|
|
|
@@ -125,7 +125,7 @@ const config = {
|
|
|
125
125
|
module.exports = config;
|
|
126
126
|
```
|
|
127
127
|
|
|
128
|
-
> इस कॉन्फ़िगरेशन फ़ाइल के माध्यम से, आप स्थानीयकृत URL, मिडलवेयर
|
|
128
|
+
> इस कॉन्फ़िगरेशन फ़ाइल के माध्यम से, आप स्थानीयकृत URL, मिडलवेयर रीडायरेक्शन, कुकी नाम, आपकी सामग्री घोषणाओं का स्थान और एक्सटेंशन सेट कर सकते हैं, कंसोल में Intlayer लॉग को अक्षम कर सकते हैं, और भी बहुत कुछ। उपलब्ध सभी पैरामीटर की पूरी सूची के लिए, [कॉन्फ़िगरेशन दस्तावेज़](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/configuration.md) देखें।
|
|
129
129
|
|
|
130
130
|
### चरण 3: अपने Vite कॉन्फ़िगरेशन में Intlayer को एकीकृत करें
|
|
131
131
|
|
|
@@ -164,11 +164,11 @@ module.exports = defineConfig({
|
|
|
164
164
|
});
|
|
165
165
|
```
|
|
166
166
|
|
|
167
|
-
> `intlayerPlugin()` Vite प्लगइन का उपयोग Intlayer को Vite के साथ एकीकृत करने के लिए किया जाता है। यह कंटेंट घोषणा फ़ाइलों के निर्माण को सुनिश्चित करता है और विकास मोड में
|
|
167
|
+
> `intlayerPlugin()` Vite प्लगइन का उपयोग Intlayer को Vite के साथ एकीकृत करने के लिए किया जाता है। यह कंटेंट घोषणा फ़ाइलों के निर्माण को सुनिश्चित करता है और विकास मोड में उनकी निगरानी करता है। यह Vite एप्लिकेशन के भीतर Intlayer पर्यावरण चर को परिभाषित करता है। इसके अतिरिक्त, यह प्रदर्शन को अनुकूलित करने के लिए उपनाम प्रदान करता है।
|
|
168
168
|
|
|
169
169
|
### चरण 4: अपनी सामग्री घोषित करें
|
|
170
170
|
|
|
171
|
-
अनुवाद संग्रहीत करने के लिए अपनी सामग्री
|
|
171
|
+
अनुवाद संग्रहीत करने के लिए अपनी सामग्री घोषणाएँ बनाएं और प्रबंधित करें:
|
|
172
172
|
|
|
173
173
|
```tsx fileName="src/app.content.tsx" contentDeclarationFormat="typescript"
|
|
174
174
|
import { t, type Dictionary } from "intlayer";
|
|
@@ -256,10 +256,10 @@ const appContent = {
|
|
|
256
256
|
t <
|
|
257
257
|
ReactNode >
|
|
258
258
|
{
|
|
259
|
-
// यदि आप अपनी सामग्री में React
|
|
259
|
+
// यदि आप अपनी सामग्री में React node का उपयोग कर रहे हैं तो React को आयात करना न भूलें
|
|
260
260
|
en: (
|
|
261
261
|
<>
|
|
262
|
-
Edit <code>src/App.tsx</code> और HMR
|
|
262
|
+
Edit <code>src/App.tsx</code> और HMR परीक्षण के लिए सहेजें
|
|
263
263
|
</>
|
|
264
264
|
),
|
|
265
265
|
fr: (
|
|
@@ -275,7 +275,7 @@ const appContent = {
|
|
|
275
275
|
},
|
|
276
276
|
|
|
277
277
|
readTheDocs: t({
|
|
278
|
-
en: "Vite और React लोगो पर क्लिक
|
|
278
|
+
en: "Vite और React लोगो पर क्लिक करें अधिक जानने के लिए",
|
|
279
279
|
fr: "Cliquez sur les logos Vite et React pour en savoir plus",
|
|
280
280
|
es: "Haga clic en los logotipos de Vite y React para obtener más información",
|
|
281
281
|
}),
|
|
@@ -315,10 +315,10 @@ const appContent = {
|
|
|
315
315
|
t <
|
|
316
316
|
ReactNode >
|
|
317
317
|
{
|
|
318
|
-
// यदि आप अपनी सामग्री में React node का उपयोग करते हैं तो React को
|
|
318
|
+
// यदि आप अपनी सामग्री में React node का उपयोग करते हैं तो React को import करना न भूलें
|
|
319
319
|
en: (
|
|
320
320
|
<>
|
|
321
|
-
Edit <code>src/App.tsx</code> और HMR
|
|
321
|
+
Edit <code>src/App.tsx</code> और HMR परीक्षण के लिए सहेजें
|
|
322
322
|
</>
|
|
323
323
|
),
|
|
324
324
|
fr: (
|
|
@@ -328,7 +328,7 @@ const appContent = {
|
|
|
328
328
|
),
|
|
329
329
|
es: (
|
|
330
330
|
<>
|
|
331
|
-
Edita <code>src/App.tsx</code> और HMR
|
|
331
|
+
Edita <code>src/App.tsx</code> और HMR परीक्षण के लिए सहेजें
|
|
332
332
|
</>
|
|
333
333
|
),
|
|
334
334
|
},
|
|
@@ -405,7 +405,7 @@ module.exports = appContent;
|
|
|
405
405
|
}
|
|
406
406
|
```
|
|
407
407
|
|
|
408
|
-
> आपकी सामग्री घोषणाएँ
|
|
408
|
+
> आपकी सामग्री घोषणाएँ आपके एप्लिकेशन में कहीं भी परिभाषित की जा सकती हैं जब वे `contentDir` निर्देशिका (डिफ़ॉल्ट रूप से, `./src`) में शामिल हो जाती हैं। और सामग्री घोषणा फ़ाइल एक्सटेंशन से मेल खाती हैं (डिफ़ॉल्ट रूप से, `.content.{json,ts,tsx,js,jsx,mjs,mjx,cjs,cjx}`)।
|
|
409
409
|
|
|
410
410
|
> अधिक विवरण के लिए, [सामग्री घोषणा प्रलेखन](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/dictionary/get_started.md) देखें।
|
|
411
411
|
|
|
@@ -556,17 +556,17 @@ const App = () => (
|
|
|
556
556
|
module.exports = App;
|
|
557
557
|
```
|
|
558
558
|
|
|
559
|
-
> यदि आप अपने कंटेंट का उपयोग किसी `string`
|
|
559
|
+
> यदि आप अपने कंटेंट का उपयोग किसी `string` एट्रिब्यूट में करना चाहते हैं, जैसे कि `alt`, `title`, `href`, `aria-label`, आदि, तो आपको फ़ंक्शन के मान को कॉल करना होगा, जैसे:
|
|
560
560
|
|
|
561
561
|
> ```jsx
|
|
562
562
|
> <img src={content.image.src.value} alt={content.image.value} />
|
|
563
563
|
> ```
|
|
564
564
|
|
|
565
|
-
> `useIntlayer` हुक के बारे में अधिक जानने के लिए, [
|
|
565
|
+
> `useIntlayer` हुक के बारे में अधिक जानने के लिए, [डॉक्यूमेंटेशन](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/packages/react-intlayer/useIntlayer.md) देखें।
|
|
566
566
|
|
|
567
567
|
### (वैकल्पिक) चरण 6: अपनी सामग्री की भाषा बदलें
|
|
568
568
|
|
|
569
|
-
अपनी सामग्री की भाषा बदलने के लिए, आप `useLocale` हुक द्वारा प्रदान किया गया `setLocale` फ़ंक्शन उपयोग कर सकते हैं। यह फ़ंक्शन आपको एप्लिकेशन की
|
|
569
|
+
अपनी सामग्री की भाषा बदलने के लिए, आप `useLocale` हुक द्वारा प्रदान किया गया `setLocale` फ़ंक्शन उपयोग कर सकते हैं। यह फ़ंक्शन आपको एप्लिकेशन की लोकल सेट करने और सामग्री को तदनुसार अपडेट करने की अनुमति देता है।
|
|
570
570
|
|
|
571
571
|
```tsx fileName="src/components/LocaleSwitcher.tsx" codeFormat="typescript"
|
|
572
572
|
import type { FC } from "react";
|
|
@@ -618,7 +618,7 @@ const LocaleSwitcher = () => {
|
|
|
618
618
|
|
|
619
619
|
### (वैकल्पिक) चरण 7: अपने एप्लिकेशन में स्थानीयकृत रूटिंग जोड़ें
|
|
620
620
|
|
|
621
|
-
इस चरण का उद्देश्य प्रत्येक भाषा के लिए अद्वितीय रूट बनाना है। यह SEO और SEO-अनुकूल
|
|
621
|
+
इस चरण का उद्देश्य प्रत्येक भाषा के लिए अद्वितीय रूट बनाना है। यह SEO और SEO-अनुकूल URLs के लिए उपयोगी है।
|
|
622
622
|
उदाहरण:
|
|
623
623
|
|
|
624
624
|
```plaintext
|
|
@@ -627,14 +627,14 @@ const LocaleSwitcher = () => {
|
|
|
627
627
|
- https://example.com/fr/about
|
|
628
628
|
```
|
|
629
629
|
|
|
630
|
-
> डिफ़ॉल्ट रूप से, डिफ़ॉल्ट लोकल के लिए रूट्स
|
|
630
|
+
> डिफ़ॉल्ट रूप से, डिफ़ॉल्ट लोकल के लिए रूट्स को कोई प्रीफ़िक्स नहीं दिया जाता है। यदि आप डिफ़ॉल्ट लोकल के लिए प्रीफ़िक्स जोड़ना चाहते हैं, तो आप अपनी कॉन्फ़िगरेशन में `middleware.prefixDefault` विकल्प को `true` पर सेट कर सकते हैं। अधिक जानकारी के लिए [कॉन्फ़िगरेशन दस्तावेज़](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/configuration.md) देखें।
|
|
631
631
|
|
|
632
|
-
अपने एप्लिकेशन में स्थानीयकृत रूटिंग जोड़ने के लिए, आप एक `LocaleRouter` कॉम्पोनेंट बना सकते हैं जो आपके एप्लिकेशन के रूट्स को लपेटता है और लोकल-आधारित रूटिंग को संभालता है। यहाँ [React Router](https://reactrouter.com/home) का उपयोग करते हुए एक उदाहरण है:
|
|
632
|
+
अपने एप्लिकेशन में स्थानीयकृत रूटिंग जोड़ने के लिए, आप एक `LocaleRouter` कॉम्पोनेंट बना सकते हैं जो आपके एप्लिकेशन के रूट्स को लपेटता है और लोकल-आधारित रूटिंग को संभालता है। यहाँ [React Router](https://reactrouter.com/home) का उपयोग करते हुए एक उदाहरण दिया गया है:
|
|
633
633
|
|
|
634
634
|
```tsx fileName="src/components/LocaleRouter.tsx" codeFormat="typescript"
|
|
635
635
|
// आवश्यक निर्भरताओं और फ़ंक्शंस को इम्पोर्ट करना
|
|
636
|
-
import { type Locales, configuration, getPathWithoutLocale } from "intlayer"; // 'intlayer' से
|
|
637
|
-
import type { FC, PropsWithChildren } from "react"; //
|
|
636
|
+
import { type Locales, configuration, getPathWithoutLocale } from "intlayer"; // 'intlayer' से उपयोगिता फ़ंक्शन और प्रकार
|
|
637
|
+
import type { FC, PropsWithChildren } from "react"; // कार्यात्मक घटकों और प्रॉप्स के लिए React प्रकार
|
|
638
638
|
import { IntlayerProvider } from "react-intlayer"; // अंतरराष्ट्रीयकरण संदर्भ के लिए प्रदाता
|
|
639
639
|
import {
|
|
640
640
|
BrowserRouter,
|
|
@@ -642,14 +642,14 @@ import {
|
|
|
642
642
|
Route,
|
|
643
643
|
Navigate,
|
|
644
644
|
useLocation,
|
|
645
|
-
} from "react-router-dom"; // नेविगेशन प्रबंधन के लिए राउटर
|
|
645
|
+
} from "react-router-dom"; // नेविगेशन प्रबंधन के लिए राउटर घटक
|
|
646
646
|
|
|
647
647
|
// Intlayer से कॉन्फ़िगरेशन को डीस्ट्रक्चर करना
|
|
648
648
|
const { internationalization, middleware } = configuration;
|
|
649
649
|
const { locales, defaultLocale } = internationalization;
|
|
650
650
|
|
|
651
651
|
/**
|
|
652
|
-
* एक
|
|
652
|
+
* एक घटक जो स्थानीयकरण को संभालता है और बच्चों को उपयुक्त लोकल संदर्भ के साथ लपेटता है।
|
|
653
653
|
* यह URL-आधारित लोकल पहचान और सत्यापन का प्रबंधन करता है।
|
|
654
654
|
*/
|
|
655
655
|
const AppLocalized: FC<PropsWithChildren<{ locale: Locales }>> = ({
|
|
@@ -710,8 +710,8 @@ const AppLocalized: FC<PropsWithChildren<{ locale: Locales }>> = ({
|
|
|
710
710
|
};
|
|
711
711
|
|
|
712
712
|
/**
|
|
713
|
-
* एक राउटर
|
|
714
|
-
* यह नेविगेशन
|
|
713
|
+
* एक राउटर घटक जो लोकल-विशिष्ट मार्ग सेट करता है।
|
|
714
|
+
* यह React Router का उपयोग नेविगेशन प्रबंधित करने और स्थानीयकृत घटकों को रेंडर करने के लिए करता है।
|
|
715
715
|
*/
|
|
716
716
|
export const LocaleRouter: FC<PropsWithChildren> = ({ children }) => (
|
|
717
717
|
<BrowserRouter>
|
|
@@ -722,7 +722,7 @@ export const LocaleRouter: FC<PropsWithChildren> = ({ children }) => (
|
|
|
722
722
|
)
|
|
723
723
|
.map((locale) => (
|
|
724
724
|
<Route
|
|
725
|
-
// लोकल को
|
|
725
|
+
// लोकल को कैप्चर करने के लिए रूट पैटर्न (जैसे, /en/, /fr/) और सभी बाद के पथों से मेल खाता है
|
|
726
726
|
path={`/${locale}/*`}
|
|
727
727
|
key={locale}
|
|
728
728
|
element={<AppLocalized locale={locale}>{children}</AppLocalized>} // बच्चों को लोकल प्रबंधन के साथ लपेटता है
|
|
@@ -730,7 +730,7 @@ export const LocaleRouter: FC<PropsWithChildren> = ({ children }) => (
|
|
|
730
730
|
))}
|
|
731
731
|
|
|
732
732
|
{
|
|
733
|
-
// यदि डिफ़ॉल्ट लोकल
|
|
733
|
+
// यदि डिफ़ॉल्ट लोकल का उपसर्ग निष्क्रिय है, तो बच्चों को सीधे रूट पथ पर रेंडर करें
|
|
734
734
|
!middleware.prefixDefault && (
|
|
735
735
|
<Route
|
|
736
736
|
path="*"
|
|
@@ -749,7 +749,7 @@ export const LocaleRouter: FC<PropsWithChildren> = ({ children }) => (
|
|
|
749
749
|
// आवश्यक निर्भरताओं और फ़ंक्शंस को आयात करना
|
|
750
750
|
import { configuration, getPathWithoutLocale } from "intlayer"; // 'intlayer' से उपयोगिता फ़ंक्शंस और प्रकार
|
|
751
751
|
// 'intlayer' से उपयोगिता फ़ंक्शंस और प्रकार
|
|
752
|
-
import { IntlayerProvider } from "react
|
|
752
|
+
import { IntlayerProvider } from "react-intlayer"; // अंतर्राष्ट्रीयकरण संदर्भ के लिए प्रदाता
|
|
753
753
|
import {
|
|
754
754
|
BrowserRouter,
|
|
755
755
|
Routes,
|
|
@@ -764,26 +764,26 @@ const { locales, defaultLocale } = internationalization;
|
|
|
764
764
|
|
|
765
765
|
/**
|
|
766
766
|
* एक घटक जो स्थानीयकरण को संभालता है और बच्चों को उपयुक्त लोकल संदर्भ के साथ लपेटता है।
|
|
767
|
-
* यह URL-आधारित
|
|
767
|
+
* यह URL-आधारित स्थानीयकरण पहचान और सत्यापन को प्रबंधित करता है।
|
|
768
768
|
*/
|
|
769
769
|
const AppLocalized = ({ children, locale }) => {
|
|
770
770
|
const { pathname, search } = useLocation(); // वर्तमान URL पथ प्राप्त करें
|
|
771
771
|
|
|
772
|
-
// वर्तमान
|
|
772
|
+
// वर्तमान स्थानीयकरण निर्धारित करें, यदि प्रदान नहीं किया गया है तो डिफ़ॉल्ट पर वापस जाएं
|
|
773
773
|
const currentLocale = locale ?? defaultLocale;
|
|
774
774
|
|
|
775
|
-
// पथ से
|
|
775
|
+
// पथ से स्थानीयकरण उपसर्ग हटाएं ताकि एक मूल पथ बनाया जा सके
|
|
776
776
|
const pathWithoutLocale = getPathWithoutLocale(
|
|
777
777
|
pathname // वर्तमान URL पथ
|
|
778
778
|
);
|
|
779
779
|
|
|
780
780
|
/**
|
|
781
|
-
* यदि middleware.prefixDefault सत्य है, तो डिफ़ॉल्ट
|
|
781
|
+
* यदि middleware.prefixDefault सत्य है, तो डिफ़ॉल्ट स्थानीयकरण हमेशा उपसर्गित होना चाहिए।
|
|
782
782
|
*/
|
|
783
783
|
if (middleware.prefixDefault) {
|
|
784
|
-
//
|
|
784
|
+
// स्थानीयकरण को सत्यापित करें
|
|
785
785
|
if (!locale || !locales.includes(locale)) {
|
|
786
|
-
//
|
|
786
|
+
// अद्यतन पथ के साथ डिफ़ॉल्ट स्थानीयकरण पर पुनर्निर्देशित करें
|
|
787
787
|
return (
|
|
788
788
|
<Navigate
|
|
789
789
|
to={`/${defaultLocale}/${pathWithoutLocale}${search}`}
|
|
@@ -792,28 +792,28 @@ const AppLocalized = ({ children, locale }) => {
|
|
|
792
792
|
);
|
|
793
793
|
}
|
|
794
794
|
|
|
795
|
-
// बच्चों को IntlayerProvider के साथ लपेटें और वर्तमान
|
|
795
|
+
// बच्चों को IntlayerProvider के साथ लपेटें और वर्तमान स्थानीयकरण सेट करें
|
|
796
796
|
return (
|
|
797
797
|
<IntlayerProvider locale={currentLocale}>{children}</IntlayerProvider>
|
|
798
798
|
);
|
|
799
799
|
} else {
|
|
800
800
|
/**
|
|
801
|
-
* जब middleware.prefixDefault गलत होता है, तो डिफ़ॉल्ट
|
|
802
|
-
* सुनिश्चित करें कि वर्तमान
|
|
801
|
+
* जब middleware.prefixDefault गलत होता है, तो डिफ़ॉल्ट स्थानीयकरण उपसर्गित नहीं होता है।
|
|
802
|
+
* सुनिश्चित करें कि वर्तमान स्थानीयकरण मान्य है और डिफ़ॉल्ट स्थानीयकरण नहीं है।
|
|
803
803
|
*/
|
|
804
804
|
if (
|
|
805
805
|
currentLocale.toString() !== defaultLocale.toString() &&
|
|
806
806
|
!locales
|
|
807
807
|
.filter(
|
|
808
|
-
(locale) => locale.toString() !== defaultLocale.toString() // डिफ़ॉल्ट
|
|
808
|
+
(locale) => locale.toString() !== defaultLocale.toString() // डिफ़ॉल्ट स्थानीयकरण को बाहर करें
|
|
809
809
|
)
|
|
810
|
-
.includes(currentLocale) // जांचें कि वर्तमान
|
|
810
|
+
.includes(currentLocale) // जांचें कि वर्तमान स्थानीयकरण मान्य स्थानीयकरणों की सूची में है या नहीं
|
|
811
811
|
) {
|
|
812
|
-
//
|
|
812
|
+
// स्थानीयकरण उपसर्ग के बिना पथ पर पुनर्निर्देशित करें
|
|
813
813
|
return <Navigate to={`${pathWithoutLocale}${search}`} replace />;
|
|
814
814
|
}
|
|
815
815
|
|
|
816
|
-
// बच्चों को IntlayerProvider के साथ लपेटें और वर्तमान
|
|
816
|
+
// बच्चों को IntlayerProvider के साथ लपेटें और वर्तमान स्थानीयकरण सेट करें
|
|
817
817
|
return (
|
|
818
818
|
<IntlayerProvider locale={currentLocale}>{children}</IntlayerProvider>
|
|
819
819
|
);
|
|
@@ -821,8 +821,8 @@ const AppLocalized = ({ children, locale }) => {
|
|
|
821
821
|
};
|
|
822
822
|
|
|
823
823
|
/**
|
|
824
|
-
* एक राउटर
|
|
825
|
-
* यह React Router का उपयोग नेविगेशन प्रबंधित करने और स्थानीयकृत
|
|
824
|
+
* एक राउटर घटक जो स्थानीयकरण-विशिष्ट मार्ग सेट करता है।
|
|
825
|
+
* यह React Router का उपयोग नेविगेशन प्रबंधित करने और स्थानीयकृत घटकों को रेंडर करने के लिए करता है।
|
|
826
826
|
*/
|
|
827
827
|
export const LocaleRouter = ({ children }) => (
|
|
828
828
|
<BrowserRouter>
|
|
@@ -833,21 +833,21 @@ export const LocaleRouter = ({ children }) => (
|
|
|
833
833
|
)
|
|
834
834
|
.map((locale) => (
|
|
835
835
|
<Route
|
|
836
|
-
//
|
|
836
|
+
// स्थानीयकरण को पकड़ने के लिए रूट पैटर्न (जैसे, /en/, /fr/) और सभी बाद के पथों से मेल खाता है
|
|
837
837
|
path={`/${locale}/*`}
|
|
838
838
|
key={locale}
|
|
839
|
-
element={<AppLocalized locale={locale}>{children}</AppLocalized>} // बच्चों को
|
|
839
|
+
element={<AppLocalized locale={locale}>{children}</AppLocalized>} // बच्चों को स्थानीयकरण प्रबंधन के साथ लपेटता है
|
|
840
840
|
/>
|
|
841
841
|
))}
|
|
842
842
|
|
|
843
843
|
{
|
|
844
|
-
// यदि डिफ़ॉल्ट
|
|
844
|
+
// यदि डिफ़ॉल्ट स्थानीयकरण के लिए उपसर्ग अक्षम है, तो बच्चों को सीधे रूट पथ पर रेंडर करें
|
|
845
845
|
!middleware.prefixDefault && (
|
|
846
846
|
<Route
|
|
847
847
|
path="*"
|
|
848
848
|
element={
|
|
849
849
|
<AppLocalized locale={defaultLocale}>{children}</AppLocalized>
|
|
850
|
-
} // बच्चों को
|
|
850
|
+
} // बच्चों को स्थानीयकरण प्रबंधन के साथ लपेटता है
|
|
851
851
|
/>
|
|
852
852
|
)
|
|
853
853
|
}
|
|
@@ -859,7 +859,7 @@ export const LocaleRouter = ({ children }) => (
|
|
|
859
859
|
```jsx fileName="src/components/LocaleRouter.cjx" codeFormat="commonjs"
|
|
860
860
|
// आवश्यक निर्भरताओं और फ़ंक्शंस को आयात करना
|
|
861
861
|
const { configuration, getPathWithoutLocale } = require("intlayer"); // 'intlayer' से उपयोगिता फ़ंक्शंस और प्रकार
|
|
862
|
-
const { IntlayerProvider, useLocale } = require("react-intlayer"); //
|
|
862
|
+
const { IntlayerProvider, useLocale } = require("react-intlayer"); // अंतरराष्ट्रीयकरण संदर्भ के लिए प्रदाता
|
|
863
863
|
const {
|
|
864
864
|
BrowserRouter,
|
|
865
865
|
Routes,
|
|
@@ -873,8 +873,8 @@ const { internationalization, middleware } = configuration;
|
|
|
873
873
|
const { locales, defaultLocale } = internationalization;
|
|
874
874
|
|
|
875
875
|
/**
|
|
876
|
-
* एक घटक जो स्थानीयकरण को संभालता है और बच्चों को उपयुक्त
|
|
877
|
-
* यह URL-आधारित
|
|
876
|
+
* एक घटक जो स्थानीयकरण को संभालता है और बच्चों को उपयुक्त स्थानीय संदर्भ के साथ लपेटता है।
|
|
877
|
+
* यह URL-आधारित स्थानीय पहचान और सत्यापन का प्रबंधन करता है।
|
|
878
878
|
*/
|
|
879
879
|
const AppLocalized = ({ children, locale }) => {
|
|
880
880
|
const { pathname, search } = useLocation(); // वर्तमान URL पथ प्राप्त करें
|
|
@@ -943,7 +943,7 @@ const LocaleRouter = ({ children }) => (
|
|
|
943
943
|
)
|
|
944
944
|
.map((locale) => (
|
|
945
945
|
<Route
|
|
946
|
-
// लोकल को
|
|
946
|
+
// लोकल को कैप्चर करने के लिए रूट पैटर्न (जैसे, /en/, /fr/) और सभी बाद के पथों से मेल खाता है
|
|
947
947
|
path={`/${locale}/*`}
|
|
948
948
|
key={locale}
|
|
949
949
|
element={<AppLocalized locale={locale}>{children}</AppLocalized>} // बच्चों को लोकल प्रबंधन के साथ लपेटता है
|
|
@@ -951,7 +951,7 @@ const LocaleRouter = ({ children }) => (
|
|
|
951
951
|
))}
|
|
952
952
|
|
|
953
953
|
{
|
|
954
|
-
// यदि डिफ़ॉल्ट लोकल
|
|
954
|
+
// यदि डिफ़ॉल्ट लोकल के लिए उपसर्ग अक्षम है, तो बच्चों को सीधे रूट पथ पर रेंडर करें
|
|
955
955
|
!middleware.prefixDefault && (
|
|
956
956
|
<Route
|
|
957
957
|
path="*"
|
|
@@ -1005,7 +1005,7 @@ const App = () => (
|
|
|
1005
1005
|
);
|
|
1006
1006
|
```
|
|
1007
1007
|
|
|
1008
|
-
साथ ही, आप अपने एप्लिकेशन में सर्वर-साइड रूटिंग जोड़ने के लिए `intLayerMiddlewarePlugin` का भी उपयोग कर सकते हैं। यह प्लगइन URL के आधार पर वर्तमान लोकल का स्वचालित रूप से पता लगाएगा और उपयुक्त लोकल कुकी सेट करेगा। यदि कोई लोकल निर्दिष्ट नहीं है, तो प्लगइन उपयोगकर्ता के ब्राउज़र भाषा प्राथमिकताओं के आधार पर सबसे उपयुक्त लोकल निर्धारित करेगा। यदि कोई लोकल पता नहीं चलता है, तो यह डिफ़ॉल्ट लोकल पर
|
|
1008
|
+
साथ ही, आप अपने एप्लिकेशन में सर्वर-साइड रूटिंग जोड़ने के लिए `intLayerMiddlewarePlugin` का भी उपयोग कर सकते हैं। यह प्लगइन URL के आधार पर वर्तमान लोकल का स्वचालित रूप से पता लगाएगा और उपयुक्त लोकल कुकी सेट करेगा। यदि कोई लोकल निर्दिष्ट नहीं है, तो प्लगइन उपयोगकर्ता के ब्राउज़र भाषा प्राथमिकताओं के आधार पर सबसे उपयुक्त लोकल निर्धारित करेगा। यदि कोई लोकल पता नहीं चलता है, तो यह डिफ़ॉल्ट लोकल पर पुनर्निर्देशित करेगा।
|
|
1009
1009
|
|
|
1010
1010
|
```typescript {3,7} fileName="vite.config.ts" codeFormat="typescript"
|
|
1011
1011
|
import { defineConfig } from "vite";
|
|
@@ -1042,7 +1042,7 @@ module.exports = defineConfig({
|
|
|
1042
1042
|
|
|
1043
1043
|
### (वैकल्पिक) चरण 8: जब लोकल बदलता है तो URL बदलें
|
|
1044
1044
|
|
|
1045
|
-
जब लोकल बदलता है तो URL बदलने के लिए, आप `useLocale` हुक द्वारा प्रदान किया गया `onLocaleChange` प्रॉप का उपयोग कर सकते हैं। साथ ही, आप URL पथ को अपडेट करने के लिए `react-router-dom` से `useLocation` और `useNavigate`
|
|
1045
|
+
जब लोकल बदलता है तो URL बदलने के लिए, आप `useLocale` हुक द्वारा प्रदान किया गया `onLocaleChange` प्रॉप का उपयोग कर सकते हैं। साथ ही, आप URL पथ को अपडेट करने के लिए `react-router-dom` से `useLocation` और `useNavigate` हुक का उपयोग कर सकते हैं।
|
|
1046
1046
|
|
|
1047
1047
|
```tsx fileName="src/components/LocaleSwitcher.tsx" codeFormat="typescript"
|
|
1048
1048
|
import { useLocation, useNavigate } from "react-router-dom";
|
|
@@ -1125,7 +1125,7 @@ const LocaleSwitcher = () => {
|
|
|
1125
1125
|
|
|
1126
1126
|
const { locale, availableLocales, setLocale } = useLocale({
|
|
1127
1127
|
onLocaleChange: (locale) => {
|
|
1128
|
-
//
|
|
1128
|
+
// अपडेटेड लोकल के साथ URL बनाएं
|
|
1129
1129
|
// उदाहरण: /es/about?foo=bar
|
|
1130
1130
|
const pathWithLocale = getLocalizedUrl(`${pathname}${search}`, locale);
|
|
1131
1131
|
|
|
@@ -1150,11 +1150,11 @@ const LocaleSwitcher = () => {
|
|
|
1150
1150
|
key={localeItem}
|
|
1151
1151
|
>
|
|
1152
1152
|
<span>
|
|
1153
|
-
{/*
|
|
1153
|
+
{/* क्षेत्र - उदाहरण के लिए FR */}
|
|
1154
1154
|
{localeItem}
|
|
1155
1155
|
</span>
|
|
1156
1156
|
<span>
|
|
1157
|
-
{/* अपनी
|
|
1157
|
+
{/* अपनी ही भाषा में - उदाहरण के लिए Français */}
|
|
1158
1158
|
{getLocaleName(localeItem, locale)}
|
|
1159
1159
|
</span>
|
|
1160
1160
|
<span dir={getHTMLTextDir(localeItem)} lang={localeItem}>
|
|
@@ -1214,19 +1214,19 @@ const LocaleSwitcher = () => {
|
|
|
1214
1214
|
key={localeItem}
|
|
1215
1215
|
>
|
|
1216
1216
|
<span>
|
|
1217
|
-
{/*
|
|
1217
|
+
{/* लोकल - उदाहरण के लिए FR */}
|
|
1218
1218
|
{localeItem}
|
|
1219
1219
|
</span>
|
|
1220
1220
|
<span>
|
|
1221
|
-
{/* अपनी
|
|
1221
|
+
{/* अपनी ही लोकल में भाषा - उदाहरण के लिए Français */}
|
|
1222
1222
|
{getLocaleName(localeItem, locale)}
|
|
1223
1223
|
</span>
|
|
1224
1224
|
<span dir={getHTMLTextDir(localeItem)} lang={localeItem}>
|
|
1225
|
-
{/* वर्तमान
|
|
1225
|
+
{/* वर्तमान लोकल में भाषा - उदाहरण के लिए Francés जब वर्तमान लोकल Locales.SPANISH पर सेट हो */}
|
|
1226
1226
|
{getLocaleName(localeItem)}
|
|
1227
1227
|
</span>
|
|
1228
1228
|
<span dir="ltr" lang={Locales.ENGLISH}>
|
|
1229
|
-
{/* अंग्रेज़ी में भाषा - उदाहरण के लिए
|
|
1229
|
+
{/* अंग्रेज़ी में भाषा - उदाहरण के लिए French */}
|
|
1230
1230
|
{getLocaleName(localeItem, Locales.ENGLISH)}
|
|
1231
1231
|
</span>
|
|
1232
1232
|
</a>
|
|
@@ -1254,11 +1254,11 @@ const LocaleSwitcher = () => {
|
|
|
1254
1254
|
|
|
1255
1255
|
### (वैकल्पिक) चरण 9: HTML भाषा और दिशा एट्रिब्यूट्स को स्विच करें
|
|
1256
1256
|
|
|
1257
|
-
जब आपका एप्लिकेशन कई भाषाओं का समर्थन करता है, तो
|
|
1257
|
+
जब आपका एप्लिकेशन कई भाषाओं का समर्थन करता है, तो `<html>` टैग के `lang` और `dir` एट्रिब्यूट्स को वर्तमान लोकल के अनुसार अपडेट करना बहुत महत्वपूर्ण होता है। ऐसा करने से निम्नलिखित सुनिश्चित होता है:
|
|
1258
1258
|
|
|
1259
|
-
-
|
|
1260
|
-
-
|
|
1261
|
-
- **एसईओ (SEO)**: सर्च इंजन
|
|
1259
|
+
- **पहुँचयोग्यता (Accessibility)**: स्क्रीन रीडर्स और सहायक तकनीकें सही `lang` एट्रिब्यूट पर निर्भर करती हैं ताकि वे सामग्री को सही ढंग से उच्चारित और व्याख्यायित कर सकें।
|
|
1260
|
+
- **टेक्स्ट रेंडरिंग (Text Rendering)**: `dir` (दिशा) एट्रिब्यूट यह सुनिश्चित करता है कि टेक्स्ट सही क्रम में प्रदर्शित हो (जैसे, अंग्रेज़ी के लिए बाएं से दाएं, अरबी या हिब्रू के लिए दाएं से बाएं), जो पठनीयता के लिए आवश्यक है।
|
|
1261
|
+
- **एसईओ (SEO)**: सर्च इंजन `lang` एट्रिब्यूट का उपयोग पृष्ठ की भाषा निर्धारित करने के लिए करते हैं, जिससे वे खोज परिणामों में सही स्थानीयकृत सामग्री प्रदान कर सकें।
|
|
1262
1262
|
|
|
1263
1263
|
जब आप इन एट्रिब्यूट्स को लोकल बदलने पर डायनामिक रूप से अपडेट करते हैं, तो आप सभी समर्थित भाषाओं में उपयोगकर्ताओं के लिए एक सुसंगत और सुलभ अनुभव की गारंटी देते हैं।
|
|
1264
1264
|
|
|
@@ -1276,16 +1276,16 @@ import { getHTMLTextDir } from "intlayer";
|
|
|
1276
1276
|
* - `lang`: ब्राउज़रों और सर्च इंजनों को पेज की भाषा की जानकारी देता है।
|
|
1277
1277
|
* - `dir`: सही पढ़ने के क्रम को सुनिश्चित करता है (जैसे, अंग्रेज़ी के लिए 'ltr', अरबी के लिए 'rtl')।
|
|
1278
1278
|
*
|
|
1279
|
-
* यह डायनामिक अपडेट
|
|
1279
|
+
* यह डायनामिक अपडेट उचित टेक्स्ट रेंडरिंग, सुलभता, और SEO के लिए आवश्यक है।
|
|
1280
1280
|
*/
|
|
1281
1281
|
export const useI18nHTMLAttributes = () => {
|
|
1282
1282
|
const { locale } = useLocale();
|
|
1283
1283
|
|
|
1284
1284
|
useEffect(() => {
|
|
1285
|
-
// वर्तमान लोकल के अनुसार
|
|
1285
|
+
// भाषा एट्रिब्यूट को वर्तमान लोकल के अनुसार अपडेट करें।
|
|
1286
1286
|
document.documentElement.lang = locale;
|
|
1287
1287
|
|
|
1288
|
-
// वर्तमान लोकल के
|
|
1288
|
+
// वर्तमान लोकल के आधार पर टेक्स्ट दिशा सेट करें।
|
|
1289
1289
|
document.documentElement.dir = getHTMLTextDir(locale);
|
|
1290
1290
|
}, [locale]);
|
|
1291
1291
|
};
|
|
@@ -1301,16 +1301,16 @@ import { getHTMLTextDir } from "intlayer";
|
|
|
1301
1301
|
* - `lang`: ब्राउज़रों और सर्च इंजनों को पेज की भाषा की जानकारी देता है।
|
|
1302
1302
|
* - `dir`: सही पढ़ने के क्रम को सुनिश्चित करता है (जैसे, अंग्रेज़ी के लिए 'ltr', अरबी के लिए 'rtl')।
|
|
1303
1303
|
*
|
|
1304
|
-
* यह डायनामिक अपडेट
|
|
1304
|
+
* यह डायनामिक अपडेट उचित टेक्स्ट रेंडरिंग, सुलभता, और SEO के लिए आवश्यक है।
|
|
1305
1305
|
*/
|
|
1306
1306
|
export const useI18nHTMLAttributes = () => {
|
|
1307
1307
|
const { locale } = useLocale();
|
|
1308
1308
|
|
|
1309
1309
|
useEffect(() => {
|
|
1310
|
-
// वर्तमान लोकल के अनुसार
|
|
1310
|
+
// भाषा एट्रिब्यूट को वर्तमान लोकल के अनुसार अपडेट करें।
|
|
1311
1311
|
document.documentElement.lang = locale;
|
|
1312
1312
|
|
|
1313
|
-
// वर्तमान लोकल के
|
|
1313
|
+
// वर्तमान लोकल के आधार पर टेक्स्ट दिशा सेट करें।
|
|
1314
1314
|
document.documentElement.dir = getHTMLTextDir(locale);
|
|
1315
1315
|
}, [locale]);
|
|
1316
1316
|
};
|
|
@@ -1326,7 +1326,7 @@ const { getHTMLTextDir } = require("intlayer");
|
|
|
1326
1326
|
* - `lang`: ब्राउज़रों और सर्च इंजनों को पेज की भाषा की जानकारी देता है।
|
|
1327
1327
|
* - `dir`: सही पढ़ने के क्रम को सुनिश्चित करता है (जैसे, अंग्रेज़ी के लिए 'ltr', अरबी के लिए 'rtl')।
|
|
1328
1328
|
*
|
|
1329
|
-
* यह डायनामिक अपडेट
|
|
1329
|
+
* यह डायनामिक अपडेट उचित टेक्स्ट रेंडरिंग, सुलभता, और SEO के लिए आवश्यक है।
|
|
1330
1330
|
*/
|
|
1331
1331
|
const useI18nHTMLAttributes = () => {
|
|
1332
1332
|
const { locale } = useLocale();
|
|
@@ -1345,7 +1345,7 @@ module.exports = { useI18nHTMLAttributes };
|
|
|
1345
1345
|
|
|
1346
1346
|
#### अपने एप्लिकेशन में हुक का उपयोग करना
|
|
1347
1347
|
|
|
1348
|
-
अपने मुख्य कॉम्पोनेंट में हुक को
|
|
1348
|
+
अपने मुख्य कॉम्पोनेंट में हुक को एकीकृत करें ताकि HTML एट्रिब्यूट्स लोकल बदलने पर अपडेट हो जाएं:
|
|
1349
1349
|
|
|
1350
1350
|
```tsx fileName="src/App.tsx" codeFormat="typescript"
|
|
1351
1351
|
import type { FC } from "react";
|
|
@@ -1400,7 +1400,7 @@ const AppContent = () => {
|
|
|
1400
1400
|
// लोकल के आधार पर <html> टैग के lang और dir एट्रिब्यूट्स को अपडेट करने के लिए हुक लागू करें।
|
|
1401
1401
|
useI18nHTMLAttributes();
|
|
1402
1402
|
|
|
1403
|
-
// ... आपके
|
|
1403
|
+
// ... आपके कंपोनेंट का बाकी हिस्सा
|
|
1404
1404
|
};
|
|
1405
1405
|
|
|
1406
1406
|
const App = () => (
|
|
@@ -1416,19 +1416,19 @@ module.exports = App;
|
|
|
1416
1416
|
|
|
1417
1417
|
- सुनिश्चित करेगा कि **भाषा** (`lang`) एट्रिब्यूट वर्तमान लोकल को सही ढंग से दर्शाए, जो SEO और ब्राउज़र व्यवहार के लिए महत्वपूर्ण है।
|
|
1418
1418
|
- लोकल के अनुसार **टेक्स्ट दिशा** (`dir`) को समायोजित करेगा, जिससे विभिन्न पढ़ने के क्रम वाली भाषाओं के लिए पठनीयता और उपयोगिता बढ़ेगी।
|
|
1419
|
-
- एक अधिक **सुलभ** अनुभव प्रदान करेगा, क्योंकि सहायक तकनीकें इन एट्रिब्यूट्स पर निर्भर करती हैं ताकि वे
|
|
1419
|
+
- एक अधिक **सुलभ** अनुभव प्रदान करेगा, क्योंकि सहायक तकनीकें इन एट्रिब्यूट्स पर निर्भर करती हैं ताकि वे बेहतर तरीके से काम कर सकें।
|
|
1420
1420
|
|
|
1421
|
-
### (वैकल्पिक) चरण 10: एक स्थानीयकृत लिंक
|
|
1421
|
+
### (वैकल्पिक) चरण 10: एक स्थानीयकृत लिंक कंपोनेंट बनाना
|
|
1422
1422
|
|
|
1423
|
-
|
|
1423
|
+
यह सुनिश्चित करने के लिए कि आपके एप्लिकेशन की नेविगेशन वर्तमान लोकल का सम्मान करती है, आप एक कस्टम `Link` कंपोनेंट बना सकते हैं। यह कंपोनेंट स्वचालित रूप से आंतरिक URL को वर्तमान भाषा के साथ प्रीफिक्स करता है। उदाहरण के लिए, जब एक फ्रेंच-भाषी उपयोगकर्ता "About" पेज के लिंक पर क्लिक करता है, तो उसे `/fr/about` पर पुनः निर्देशित किया जाता है, न कि `/about` पर।
|
|
1424
1424
|
|
|
1425
1425
|
यह व्यवहार कई कारणों से उपयोगी है:
|
|
1426
1426
|
|
|
1427
|
-
- **SEO और उपयोगकर्ता अनुभव**: स्थानीयकृत URL खोज
|
|
1428
|
-
- **संगति**: अपने एप्लिकेशन में स्थानीयकृत लिंक का उपयोग करके, आप सुनिश्चित करते हैं कि नेविगेशन वर्तमान लोकल के भीतर ही रहता है, जिससे अप्रत्याशित भाषा
|
|
1429
|
-
- **रखरखाव योग्यता**: स्थानीयकरण लॉजिक को एक ही
|
|
1427
|
+
- **SEO और उपयोगकर्ता अनुभव**: स्थानीयकृत URL खोज इंजन को भाषा-विशिष्ट पृष्ठों को सही ढंग से इंडेक्स करने में मदद करते हैं और उपयोगकर्ताओं को उनकी पसंदीदा भाषा में सामग्री प्रदान करते हैं।
|
|
1428
|
+
- **संगति**: अपने एप्लिकेशन में स्थानीयकृत लिंक का उपयोग करके, आप सुनिश्चित करते हैं कि नेविगेशन वर्तमान लोकल के भीतर ही रहता है, जिससे अप्रत्याशित भाषा स्विचिंग से बचा जा सकता है।
|
|
1429
|
+
- **रखरखाव योग्यता**: स्थानीयकरण लॉजिक को एक ही कंपोनेंट में केंद्रीकृत करने से URL प्रबंधन सरल हो जाता है, जिससे आपका कोडबेस बनाए रखना और बढ़ाना आसान हो जाता है क्योंकि आपका एप्लिकेशन बढ़ता है।
|
|
1430
1430
|
|
|
1431
|
-
नीचे TypeScript में एक स्थानीयकृत `Link`
|
|
1431
|
+
नीचे TypeScript में एक स्थानीयकृत `Link` कंपोनेंट का कार्यान्वयन दिया गया है:
|
|
1432
1432
|
|
|
1433
1433
|
```tsx fileName="src/components/Link.tsx" codeFormat="typescript"
|
|
1434
1434
|
import { getLocalizedUrl } from "intlayer";
|
|
@@ -1453,8 +1453,8 @@ export const checkIsExternalLink = (href?: string): boolean =>
|
|
|
1453
1453
|
/^https?:\/\//.test(href ?? "");
|
|
1454
1454
|
|
|
1455
1455
|
/**
|
|
1456
|
-
* एक कस्टम Link
|
|
1457
|
-
* आंतरिक लिंक के लिए, यह `getLocalizedUrl` का उपयोग करता है ताकि URL के
|
|
1456
|
+
* एक कस्टम Link कंपोनेंट जो वर्तमान लोकल के आधार पर href एट्रिब्यूट को अनुकूलित करता है।
|
|
1457
|
+
* आंतरिक लिंक के लिए, यह `getLocalizedUrl` का उपयोग करता है ताकि URL के साथ लोकल (जैसे, /fr/about) जोड़ा जा सके।
|
|
1458
1458
|
* यह सुनिश्चित करता है कि नेविगेशन उसी लोकल संदर्भ के भीतर रहता है।
|
|
1459
1459
|
*/
|
|
1460
1460
|
export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
|
|
@@ -1490,9 +1490,9 @@ export const checkIsExternalLink = (href?: string): boolean =>
|
|
|
1490
1490
|
/^https?:\/\//.test(href ?? "");
|
|
1491
1491
|
|
|
1492
1492
|
/**
|
|
1493
|
-
* एक कस्टम Link
|
|
1493
|
+
* एक कस्टम Link कंपोनेंट जो वर्तमान लोकल के आधार पर href एट्रिब्यूट को अनुकूलित करता है।
|
|
1494
1494
|
* आंतरिक लिंक के लिए, यह `getLocalizedUrl` का उपयोग करता है ताकि URL के आगे लोकल जोड़ा जा सके (जैसे, /fr/about)।
|
|
1495
|
-
* यह सुनिश्चित करता है कि नेविगेशन उसी लोकल संदर्भ के भीतर
|
|
1495
|
+
* यह सुनिश्चित करता है कि नेविगेशन उसी लोकल संदर्भ के भीतर बना रहे।
|
|
1496
1496
|
*/
|
|
1497
1497
|
/
|
|
1498
1498
|
export const Link = forwardRef(({ href, children, ...props }, ref) => {
|
|
@@ -1525,9 +1525,9 @@ const { forwardRef } = require("react");
|
|
|
1525
1525
|
const checkIsExternalLink = (href) => /^https?:\/\//.test(href ?? "");
|
|
1526
1526
|
|
|
1527
1527
|
/**
|
|
1528
|
-
* एक कस्टम Link
|
|
1528
|
+
* एक कस्टम Link कंपोनेंट जो वर्तमान लोकल के आधार पर href एट्रिब्यूट को अनुकूलित करता है।
|
|
1529
1529
|
* आंतरिक लिंक के लिए, यह `getLocalizedUrl` का उपयोग करता है ताकि URL के आगे लोकल जोड़ा जा सके (जैसे, /fr/about)।
|
|
1530
|
-
* यह सुनिश्चित करता है कि नेविगेशन उसी लोकल संदर्भ के भीतर
|
|
1530
|
+
* यह सुनिश्चित करता है कि नेविगेशन उसी लोकल संदर्भ के भीतर बना रहे।
|
|
1531
1531
|
*/
|
|
1532
1532
|
const Link = forwardRef(({ href, children, ...props }, ref) => {
|
|
1533
1533
|
const { locale } = useLocale();
|
|
@@ -1560,12 +1560,12 @@ Link.displayName = "Link";
|
|
|
1560
1560
|
`useLocale` हुक वर्तमान लोकल प्रदान करता है (जैसे, फ्रेंच के लिए `fr`)।
|
|
1561
1561
|
|
|
1562
1562
|
- **URL का स्थानीयकरण**:
|
|
1563
|
-
आंतरिक लिंक (अर्थात् गैर-बाहरी) के लिए, `getLocalizedUrl` का उपयोग वर्तमान लोकल के साथ URL
|
|
1563
|
+
आंतरिक लिंक (अर्थात् गैर-बाहरी) के लिए, `getLocalizedUrl` का उपयोग वर्तमान लोकल के साथ URL को स्वचालित रूप से उपसर्गित करने के लिए किया जाता है। इसका मतलब है कि यदि आपका उपयोगकर्ता फ्रेंच में है, तो `/about` को `href` के रूप में पास करने पर यह `/fr/about` में परिवर्तित हो जाएगा।
|
|
1564
1564
|
|
|
1565
1565
|
- **लिंक लौटाना**:
|
|
1566
|
-
कंपोनेंट एक `<a>` एलिमेंट लौटाता है जिसमें स्थानीयकृत URL होता है, यह सुनिश्चित
|
|
1566
|
+
कंपोनेंट एक `<a>` एलिमेंट लौटाता है जिसमें स्थानीयकृत URL होता है, यह सुनिश्चित करता है कि नेविगेशन स्थानीय भाषा के अनुरूप हो।
|
|
1567
1567
|
|
|
1568
|
-
अपने एप्लिकेशन में इस `Link` कंपोनेंट को एकीकृत करके, आप एक सुसंगत और भाषा-सचेत उपयोगकर्ता अनुभव बनाए रखते हैं, साथ ही बेहतर SEO और उपयोगिता
|
|
1568
|
+
अपने एप्लिकेशन में इस `Link` कंपोनेंट को एकीकृत करके, आप एक सुसंगत और भाषा-सचेत उपयोगकर्ता अनुभव बनाए रखते हैं, साथ ही बेहतर SEO और उपयोगिता का लाभ भी प्राप्त करते हैं।
|
|
1569
1569
|
|
|
1570
1570
|
### TypeScript कॉन्फ़िगर करें
|
|
1571
1571
|
|
|
@@ -1575,14 +1575,14 @@ Intlayer TypeScript के लाभ प्राप्त करने और
|
|
|
1575
1575
|
|
|
1576
1576
|

|
|
1577
1577
|
|
|
1578
|
-
सुनिश्चित करें कि आपकी TypeScript कॉन्फ़िगरेशन में
|
|
1578
|
+
सुनिश्चित करें कि आपकी TypeScript कॉन्फ़िगरेशन में ऑटो-जेनरेटेड टाइप्स शामिल हैं।
|
|
1579
1579
|
|
|
1580
1580
|
```json5 fileName="tsconfig.json"
|
|
1581
1581
|
{
|
|
1582
|
-
// ...
|
|
1582
|
+
// ... आपकी मौजूदा TypeScript कॉन्फ़िगरेशन
|
|
1583
1583
|
"include": [
|
|
1584
1584
|
// ... आपके मौजूदा TypeScript कॉन्फ़िगरेशन
|
|
1585
|
-
".intlayer/**/*.ts", //
|
|
1585
|
+
".intlayer/**/*.ts", // स्वचालित रूप से जनरेट किए गए प्रकारों को शामिल करें
|
|
1586
1586
|
],
|
|
1587
1587
|
}
|
|
1588
1588
|
```
|
|
@@ -1600,16 +1600,16 @@ Intlayer TypeScript के लाभ प्राप्त करने और
|
|
|
1600
1600
|
|
|
1601
1601
|
### VS कोड एक्सटेंशन
|
|
1602
1602
|
|
|
1603
|
-
Intlayer के साथ अपने विकास अनुभव को बेहतर बनाने के लिए, आप आधिकारिक **Intlayer VS
|
|
1603
|
+
Intlayer के साथ अपने विकास अनुभव को बेहतर बनाने के लिए, आप आधिकारिक **Intlayer VS Code एक्सटेंशन** इंस्टॉल कर सकते हैं।
|
|
1604
1604
|
|
|
1605
|
-
[VS
|
|
1605
|
+
[VS Code मार्केटप्लेस से इंस्टॉल करें](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
|
|
1606
1606
|
|
|
1607
1607
|
यह एक्सटेंशन प्रदान करता है:
|
|
1608
1608
|
|
|
1609
|
-
-
|
|
1610
|
-
- **अनुवादों के लिए
|
|
1609
|
+
- **अनुवाद कुंजियों के लिए ऑटोकंप्लीशन**।
|
|
1610
|
+
- **अनुवादों के लिए रीयल-टाइम त्रुटि पहचान**।
|
|
1611
1611
|
- **अनुवादित सामग्री के इनलाइन पूर्वावलोकन**।
|
|
1612
|
-
-
|
|
1612
|
+
- **तेजी से क्रियाएं** ताकि आप आसानी से अनुवाद बना और अपडेट कर सकें।
|
|
1613
1613
|
|
|
1614
1614
|
विस्तृत जानकारी के लिए, एक्सटेंशन का उपयोग कैसे करें, देखें [Intlayer VS Code एक्सटेंशन दस्तावेज़](https://intlayer.org/doc/vs-code-extension)।
|
|
1615
1615
|
|
|
@@ -1617,7 +1617,7 @@ Intlayer के साथ अपने विकास अनुभव को
|
|
|
1617
1617
|
|
|
1618
1618
|
### आगे बढ़ें
|
|
1619
1619
|
|
|
1620
|
-
आगे बढ़ने के लिए, आप [विज़ुअल एडिटर](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_visual_editor.md) को लागू कर सकते हैं या अपनी सामग्री को [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_CMS.md) का उपयोग करके बाहरी कर सकते हैं।
|
|
1620
|
+
आगे बढ़ने के लिए, आप [विज़ुअल एडिटर](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_visual_editor.md) को लागू कर सकते हैं या अपनी सामग्री को [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/hi/intlayer_CMS.md) का उपयोग करके बाहरी रूप से प्रबंधित कर सकते हैं।
|
|
1621
1621
|
|
|
1622
1622
|
---
|
|
1623
1623
|
|