दस्तावेज़ एस्ट्रो

एस्ट्रो

स्थिर और सर्वर-रेंडर की गई बहुभाषी साइटों के लिए i1n को Astro के साथ एकीकृत करें।

सेटअप

अपने Astro प्रोजेक्ट में i1n init चलाएँ। CLI लोकेल/ डायरेक्टरी में नेस्टेड JSON फॉर्मेट को कॉन्फ़िगर करता है। Astro प्रोजेक्ट आमतौर पर स्टैंडअलोन मोड में i1n SDK का उपयोग करते हैं।

एक यूटिलिटी मॉड्यूल (जैसे, src/i18n/index.ts) बनाएँ जो i18n को इनिशियलाइज़ करता है और useTranslations() फ़ंक्शन को एक्सपोर्ट करता है। यह फ़ंक्शन उपयुक्त लोकेल रिसोर्स लोड करता है और टाइप-सेफ़ t() फ़ंक्शन लौटाता है।

उपयोग

अपने .astro पेजों में, t() फ़ंक्शन प्राप्त करने के लिए फ्रंटमैटर में useTranslations(locale) को कॉल करें। अपने टेम्प्लेट में अनुवादित स्ट्रिंग्स को रेंडर करने के लिए इसका उपयोग करें। चूंकि Astro कंपोनेंट बिल्ड टाइम पर चलते हैं, अनुवाद स्टैटिक रूप से जेनरेट किए गए HTML में एम्बेड किए जाते हैं।

फ़ाइलों को प्रबंधनीय रखने के लिए नेमस्पेस (जैसे, common.json, home.json, docs.json) द्वारा अनुवाद व्यवस्थित करें। आंतरिक नेविगेशन के लिए लोकेल-प्रीफ़िक्स्ड URL जेनरेट करने के लिए getLocalePath(locale, path) का उपयोग करें।

स्थिर जनरेशन

सभी समर्थित लोकेल के लिए पेज बनाने हेतु getStaticPaths() का उपयोग करें। प्रत्येक लोकेल वैरिएंट को एक अलग HTML पेज के रूप में बनाया जाता है, जो उचित hreflang टैग के साथ तेज़ लोडिंग और बेहतर SEO सुनिश्चित करता है।

स्थिर पीढ़ी से पहले अनुवाद फ़ाइलें सिंक में हैं, यह सुनिश्चित करने के लिए अपने बिल्ड चरण में i1n पुल जोड़ें। Astro की बिल्ड प्रक्रिया तब सभी स्थानीय रूपांतरों को स्वचालित रूप से उत्पन्न करेगी।

ब्रिज मोड

एस्ट्रो प्रोजेक्ट आमतौर पर बाहरी i18n लाइब्रेरी के बजाय सीधे i1n SDK का उपयोग करते हैं। हालाँकि, यदि आप फ़्रेमवर्क एकीकरण (जैसे, एस्ट्रो के अंदर रिएक्ट कंपोनेंट्स) का उपयोग करते हैं, तो आप उन फ़्रेमवर्क आइलैंड्स के भीतर ब्रिज मोड का उपयोग कर सकते हैं।

रिएक्ट आइलैंड्स के लिए: registerI1n((key, params) => i18next.t(key, params))। वू आइलैंड्स के लिए: registerI1n((key, params) => i18n.global.t(key, params))। एस्ट्रो शेल और फ्रेमवर्क आइलैंड्स में से प्रत्येक अपने पसंदीदा तरीके का उपयोग कर सकता है।

src/i18n/index.ts
import { init, t as i1nT } from 'i1n'

export function useTranslations(locale: string) {
  init({
    locale,
    resources: loadResources(locale)
  })
  return i1nT
}

संबंधित