TacoTranslate
/
ਡੌਕੂਮੈਂਟੇਸ਼ਨਕੀਮਤਾਂ
 
  1. ਪ੍ਰਸਤਾਵਨਾ
  2. ਸ਼ੁਰੂਆਤ ਕਰਨਾ
  3. ਸੈੱਟਅੱਪ ਅਤੇ ਸੰਰਚਨਾ
  4. TacoTranslate ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ
  5. ਸਰਵਰ-ਸਾਈਡ ਰੈਂਡਰਿੰਗ
  6. ਉੱਨਤ ਵਰਤੋਂ
  7. ਸਰਵੋਤਮ ਅਭਿਆਸ
  8. ਤ੍ਰੁਟਿ ਸੰਭਾਲਣ ਅਤੇ ਡੀਬੱਗਿੰਗ
  9. ਸਮਰਥਿਤ ਭਾਸ਼ਾਵਾਂ

ਉੱਨਤ ਵਰਤੋਂ

ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਭਾਸ਼ਾਵਾਂ ਦਾ ਸੰਭਾਲ ਕਰਨਾ

TacoTranslate ਤੁਹਾਡੇ React ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਅਰਬੀ ਅਤੇ ਹਿਬ੍ਰੂ ਵਰਗੀਆਂ ਸੱਜੇ-ਤੋਂ ਖੱਬੇ (RTL) ਭਾਸ਼ਾਵਾਂ ਦਾ ਸਮਰਥਨ ਕਰਨਾ ਆਸਾਨ ਬਣਾਉਂਦਾ ਹੈ। RTL ਭਾਸ਼ਾਵਾਂ ਦੀ ਠੀਕ ਤਰੀਕੇ ਨਾਲ ਸੰਭਾਲ ਯਕੀਨੀ ਬਣਾਉਂਦੀ ਹੈ ਕਿ ਤੁਹਾਡਾ ਸਮੱਗਰੀ ਉਹਨਾਂ ਯੂਜ਼ਰਾਂ ਲਈ ਸਹੀ ਤਰੀਕੇ ਨਾਲ ਦਰਸਾਈ ਜਾਵੇ ਜੋ ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਪੜ੍ਹਦੇ ਹਨ।

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

ਤੁਸੀਂ ਮੌਜੂਦ isRightToLeftLocaleCode ਫੰਕਸ਼ਨ ਦਾ ਇਸਤੇਮਾਲ ਕਰਕੇ React ਤੋਂ ਬਾਹਰ ਮੌਜੂਦਾ ਭਾਸ਼ਾ ਨੂੰ ਵੀ ਚੈੱਕ ਕਰ ਸਕਦੇ ਹੋ।

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

ਅਨੁਵਾਦ ਨੂੰ ਅਣਚਾਲੂ ਕਰਨਾ

ਕਿਸੇ ਸਟਰਿੰਗ ਦੇ ਵਿਸ਼ੇਸ਼ ਹਿੱਸਿਆਂ ਦੀ ਅਨੁਵਾਦਨ ਨੂੰ 비ਰਰੋਕਣਾ ਜਾਂ ਕੁਝ ਖੰਡਾਂ ਨੂੰ ਜਿਵੇਂ ਹਨ ਤਿਵੇਂ ਸੰਭਾਲ ਕੇ ਰੱਖਣ ਲਈ, ਤੁਸੀਂ ਤਿੰਨ ਗੁਣਾ ਵਰਗਾਕਾਰ ਕੋਠੜੀਆਂ triple square brackets ਵਰਤ ਸਕਦੇ ਹੋ। ਇਹ ਵਿਸ਼ੇਸ਼ਤਾ ਨਾਮਾਂ, ਤਕਨੀਕੀ ਸ਼ਬਦਾਂ, ਜਾਂ ਹੋਰ ਕਿਸੇ ਸਮੱਗਰੀ ਦੇ ਮੂਲ ਫਾਰਮੈਟ ਨੂੰ ਬਰਕਰਾਰ ਰੱਖਣ ਲਈ ਲਾਭਦਾਇਕ ਹੈ ਜੋ ਅਨੁਵਾਦ ਨਹੀਂ ਹੋਣਾ ਚਾਹੀਦਾ।

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

ਇਸ ਉਦਾਹਰਨ ਵਿੱਚ, ਸ਼ਬਦ “TacoTranslate” ਅਨੁਵਾਦ ਵਿੱਚ ਬਦਲੇ ਜਾਣਗੇ ਨਹੀਂ।

ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾ

ਅਸੀਂ ਤੁਹਾਡੇ ਐਪ ਵਿੱਚ ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਬਲਅਤੇ ਸਿਫਾਰਸ਼ ਕਰਦੇ ਹਾਂ। ਇਹ ਤੁਹਾਡੇ ਅਨੁਵਾਦਾਂ ਅਤੇ ਸਤਰਾਂ ਨੂੰ ਵੱਖ-ਵੱਖ ਮੂਲਾਂ ਵਿੱਚ ਵਿਵਸਥਿਤ ਕਰਨ ਲਈ ਲਾਭਦਾਇਕ ਹੈ, ਜਿਵੇਂ ਕਿ ਤੁਹਾਡਾ ਹੈਡਰ, ਫੁੱਟਰ ਜਾਂ ਵਿਸ਼ੇਸ਼ ਹਿੱਸੇ।

ਤੁਸੀਂ ਇੱਥੇ origins ਦੀ ਵਰਤੋਂ ਬਾਰੇ ਹੋਰ ਪੜ੍ਹ ਸਕਦੇ ਹੋ।

TacoTranslate ਪ੍ਰਦਾਤਾ ਕਿਸੇ ਵੀ ਮਾਤਾ ਪ੍ਰਦਾਤਾ ਤੋਂ ਸੈਟਿੰਗਾਂ ਉਤਾਰ ਲੈਂਦੇ ਹਨ, ਇਸ ਲਈ ਤੁਹਾਨੂੰ ਹੋਰ ਕੋਈ ਸੈਟਿੰਗ ਦੁਹਰਾਉਣ ਦੀ ਲੋੜ ਨਹੀਂ ਹੋਏਗੀ।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Header() {
	return (
		<TacoTranslate origin="header">
			// ...
		</TacoTranslate>
	);
}

function Menu() {
	return (
		<TacoTranslate origin="menu">
			// ...
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Header />
			<Menu />
		</TacoTranslate>
	);
}

ਮੂਲ ਜਾਂ ਭਾਸ਼ਾ ਨੂੰ ਓਵਰਰਾਈਡ ਕਰਨਾ

ਕਈ TacoTranslate ਪ੍ਰੋਵਾਈਡਰਾਂ ਨੂੰ ਵਰਤਣ ਦੇ ਨਾਲ-ਨਾਲ, ਤੁਸੀਂ Translate ਕੰਪੋਨੈਂਟ ਅਤੇ useTranslation ਹੂਕ ਸਤਰਾਂ 'ਤੇ ਦੋਹਾਂ origin ਅਤੇ locale ਨੂੰ ਵੀ ਓਵਰਰਾਈਡ ਕਰ ਸਕਦੇ ਹੋ।

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

ਲੋਡਿੰਗ ਸੰਭਾਲਣਾ

ਜਦੋਂ ਕਲਾਇਂਟ ਪਾਸੇ ਭਾਸ਼ਾਵਾਂ ਬਦਲ ਰਹੇ ਹੋ, ਤਰਜਮਿਆਂ ਨੂੰ ਲੈ ਕੇ ਆਉਣ ਵਿੱਚ ਉਪਭੋਗਤਾ ਦੇ ਕਨੈਕਸ਼ਨ ਦੇ ਅਨੁਸਾਰ ਕੁਝ ਸਮਾਂ ਲੱਗ ਸਕਦਾ ਹੈ। ਤੁਸੀਂ ਇਸ ਬਦਲਾਅ ਦੌਰਾਨ ਵਿਜ਼ੂਅਲ ਫੀਡਬੈਕ ਦੇ ਕੇ ਉਪਭੋਗਤਾ ਦੇ ਅਨੁਭਵ ਨੂੰ ਸੁਧਾਰਨ ਲਈ ਲੋਡਿੰਗ ਸੁਚਕ ਦਰਸਾ ਸਕਦੇ ਹੋ।

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

ਬਹੁਵਚਨ

ਵੱਖ-ਵੱਖ ਭਾਸ਼ਾਵਾਂ ਵਿੱਚ ਬਹੁਵਚਨ ਸੰਭਾਲਣ ਅਤੇ ਗਿਣਤੀ-ਆਧਾਰਿਤ ਲੇਬਲ ਸਹੀ ਢੰਗ ਨਾਲ ਦਰਸਾਉਣ ਲਈ, ਇਹ ਸਭ ਤੋਂ ਵਧੀਆ ਅਮਲ ਮੰਨਿਆ ਜਾਂਦਾ ਹੈ:

import {Translate, useLocale} from 'tacotranslate/react';

function PhotoCount() {
	const locale = useLocale();
	const count = 1;

	return count === 0 ? (
		<Translate string="You have no photos." />
	) : count === 1 ? (
		<Translate string="You have 1 photo." />
	) : (
		<Translate
			string="You have {{count}} photos."
			variables={{count: count.toLocaleString(locale)}}
		/>
	);
}

ਕਈ ਭਾਸ਼ਾਵਾਂ

ਇਕੋ ਸਮੇਂ ਇਕ ਹੀ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ ਕਈ ਭਾਸ਼ਾਵਾਂ ਦਾ ਸਮਰਥਨ ਕਰਨ ਲਈ, ਤੁਸੀਂ ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾਵਾਂ ਨੂੰ ਵੱਖ-ਵੱਖ locale ਮੁੱਲਾਂ ਨਾਲ ਵਰਤ ਸਕਦੇ ਹੋ, ਜਿਵੇਂ ਹੇਠਾਂ ਦਿਖਾਇਆ ਗਿਆ ਹੈ:

ਤੁਸੀਂ locale ਨੂੰ ਕੰਪੋਨੈਂਟ ਜਾਂ ਹੁੱਕ ਸਤਰ 'ਤੇ ਵੀ ਓਵਰਰਾਈਡ ਕਰ ਸਕਦੇ ਹੋ।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate, Translate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Spanish() {
	return (
		<TacoTranslate locale="es">
			<Translate string="Hello, world in Spanish!" />
		</TacoTranslate>
	);
}

function Norwegian() {
	return (
		<TacoTranslate locale="no">
			<Translate string="Hello, world in Norwegian!" />
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Spanish />
			<Norwegian />
		</TacoTranslate>
	);
}

ਅਨੁਵਾਦ ID ਵਰਤਣਾ

ਤੁਸੀਂ Translate 컴ਪੋਨੈਂਟ ਨੂੰ ਵੱਖ-ਵੱਖ ਅਨੁਵਾਦਾਂ ਜਾਂ ਇਸੇ ਸਤਰ ਦੇ ਅਰਥਾਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ ਇੱਕ id ਜੋੜ ਸਕਦੇ ਹੋ। ਇਹ ਖਾਸ ਕਰਕੇ ਲਾਭਦਾਇਕ ਹੈ ਜਦੋਂ ਇਕੋ ਹੀ ਲਿਖਤ ਸੰਦਰਭ ਦੇ ਅਧਾਰ 'ਤੇ ਵੱਖਰੇ ਅਨੁਵਾਦ ਮੰਗਦੀ ਹੈ। ਵੱਖਰੇ IDs ਦੀ ਨਿਯੁਕਤੀ ਕਰਕੇ, ਤੁਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦੇ ਹੋ ਕਿ ਸਤਰ ਦਾ ਹਰ ਉਦਾਹਰਨ ਆਪਣੇ ਵਿਸ਼ੇਸ਼ ਅਰਥ ਅਨੁਸਾਰ ਸਹੀ ਤਰ੍ਹਾਂ ਅਨੁਵਾਦਿਤ ਹੋਵੇ।

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

ਉਦਾਹਰਨ ਲਈ, ਹੈਡਰ ਲਾਗਿਨ ਦਾ ਅਨੁਵਾਦ ਸਪੇਨੀ ਵਿੱਚ “Iniciar sesión” ਹੋ ਸਕਦਾ ਹੈ, ਅਤੇ ਫੁਟਰ ਲਾਗਿਨ ਦਾ ਅਨੁਵਾਦ “Acceder” ਹੋ ਸਕਦਾ ਹੈ।

ਸਰਵੋਤਮ ਅਭਿਆਸ

ਇੱਕ ਉਤਪਾਦ Nattskiftet ਵੱਲੋਂਨਾਰਵੇ ਵਿੱਚ ਬਣਾਇਆ ਗਿਆ