Dokumentacija: Uporaba TacoTranslate

Uporaba TacoTranslate

Slovenian

Prevajanje nizov

Trenutno obstajajo trije načini za prevajanje nizov: komponenta Translate, hook useTranslation, ali pripomoček translateEntries.

Uporaba komponente Translate.
Izpiše prevode znotraj elementa span, ter podpira upodabljanje HTML.

import {Translate} from 'tacotranslate/react';

function Page() {
	return <Translate string="Hello, world!" />;
}

Vrsto elementa lahko spremenite z uporabo, na primer, as="p" na komponenti.

Uporaba hooka useTranslation
Vrne prevode kot navadno besedilo. Uporabno na primer v meta oznakah.

import {useEffect} from 'react';
import {useTranslation} from 'tacotranslate/react';

function Page() {
	const helloWorld = useTranslation('Hello, world!');

	useEffect(() => {
		alert(helloWorld);
	}, [helloWorld]);

	return (
		<title>{useTranslation('My page title')}</title>
	);
}

Uporaba pripomočka translateEntries
Prevajajte nize na strežniški strani. Pospešite svoje OpenGraph slike.

import {createEntry, translateEntries} from 'tacotranslate';

async function generateMetadata(locale = 'es') {
	const title = createEntry({string: 'Hello, world!'});
	const description = createEntry({string: 'TacoTranslate on the server'});

	const translations = await translateEntries(
		tacoTranslate,
		{origin: 'opengraph', locale},
		[title, description]
	);

	return {
		title: translations(title),
		description: translations(description)
	};
}

Ko nizi prispejo na naše strežnike, jih najprej preverimo in shranimo, nato pa takoj vrnemo strojni prevod. Čeprav so strojni prevodi na splošno nižjega kakovostnega nivoja v primerjavi z našimi AI prevodi, zagotavljajo hiter začetni odziv.

Hkrati sprožimo asinhrono prevajalsko opravilo za ustvarjanje visokokakovostnega, najsodobnejšega AI prevoda za vaš niz. Ko je AI prevod pripravljen, bo nadomestil strojni prevod in bil poslan vsakič, ko zahtevate prevode svojih nizov.

Če ste niz ročno prevedli, imajo ti prevodi prednost in so namesto tega vrnjeni.

Uporaba izvorov

Projekti TacoTranslate vsebujejo tisto, čemur pravimo izvor. Pomislite nanje kot na izhodišča, mape ali skupine za vaše nize in prevode.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins vam omogočajo, da ločite nize v smiselne vsebnike. Na primer, lahko imate en origin za dokumentacijo in drugega za vašo marketinško stran.

Za bolj natančen nadzor lahko konfigurirate izvore na ravni komponent.

Za to razmislite o uporabi več ponudnikov TacoTranslate v vašem projektu.

Upoštevajte, da ista niz lahko prejme različne prevode v različnih izvorih.

Na koncu je ločevanje nizov na izvore odvisno od vas in vaših potreb. Vendar pa upoštevajte, da lahko veliko nizov znotraj enega izvora poveča čas nalaganja.

Ravnanje s spremenljivkami

Vedno uporabljajte spremenljivke za dinamične vsebine, kot so uporabniška imena, datumi, e-poštni naslovi in podobno.

Spremenljivke v nizih so deklarirane z uporabo dvojnih oglatih oklepajev, na primer {{variable}}.

import {Translate} from 'tacotranslate/react';

function Greeting() {
	const name = 'Juan';
	return <Translate string="Hello, {{name}}!" variables={{name}} />;
}

import {useTranslation} from 'tacotranslate/react';

function useGreeting() {
	const name = 'Juan';
	return useTranslation('Hello, {{name}}!', {variables: {name}});
}

Upravljanje vsebine HTML

Privzeto komponenta Translate podpira in prikazuje HTML vsebino. Vendar se lahko iz tega vedenja izključite tako, da nastavite useDangerouslySetInnerHTML na false.

Onemogočanje upodabljanja HTML je močno priporočeno pri prevajanju vsebine, ki ji ni mogoče zaupati, kot je vsebina, ki jo ustvarijo uporabniki.

Vsi izhodi so vedno očiščeni z sanitize-html pred prikazom.

import {Translate} from 'tacotranslate/react';

function Page() {
	return (
		<Translate
			string={`
				Welcome to <strong>my</strong> website.
				I’m using <a href="{{url}}">TacoTranslate</a> to translate text.
			`}
			variables={{url: 'https://tacotranslate.com'}}
			useDangerouslySetInnerHTML={false}
		/>
	);
}

Zgornji primer bo prikazan kot navadno besedilo.

Upodabljanje na strežniški strani

Uporaba TacoTranslate

Kako se prevajajo nizi

Uporaba izvorov

Ravnanje s spremenljivkami

Upravljanje vsebine HTML