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 komponenta Translate.
Prikaže prevode znotraj elementa span, ter podpira upodabljanje HTML-ja.

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 navaden niz. 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 vaše 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 manj kakovostni v primerjavi z našimi AI prevodi, zagotavljajo hitro začetno odzivnost.

Hkrati začnemo asinhrono prevajalsko opravilo za ustvarjanje visokokakovostnega, najsodobnejšega AI prevoda za vaš niz. Ko je AI prevod pripravljen, bo nadomestil strojni prevod in bo poslan vsakič, ko zahtevate prevode za vaše nize.

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

Uporaba izvorov

Projekti TacoTranslate vsebujejo tisto, čemur pravimo izvor. Predstavljajte si jih kot vstopne točke, 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 ločevanje nizov 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 izvor nastavite na ravni komponente.

Za dosego tega razmislite o uporabi več ponudnikov TacoTranslate znotraj vašega projekta.

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

Nazadnje je razdelitev nizov v izvore odvisna od vas in vaših potreb. Vendar pa upoštevajte, da lahko veliko število nizov v enem izvoru podaljša čas nalaganja.

Ravnanje s spremenljivkami

Za dinamično vsebino, kot so uporabniška imena, datumi, e-poštni naslovi in podobno, morate vedno uporabljati spremenljivke.

Spremenljivke v nizih so deklarirane z dvojnimi oglatimi oklepaji, kot {{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 upodablja HTML vsebino. Vendar se lahko iz tega vedenja izključite tako, da nastavite useDangerouslySetInnerHTML na false.

Onemogočanje upodabljanja HTML je močno priporočljivo pri prevajanju nepreverjene vsebine, kot je vsebina, ki jo ustvari uporabnik.

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 strani strežnika

Uporaba TacoTranslate

Kako so nizi prevedeni

Uporaba izvorov

Ravnanje s spremenljivkami

Upravljanje vsebine HTML