Dokumentacija: TacoTranslate naudojimas

Naudojant TacoTranslate

Lithuanian

Eilutėse vertimas

Šiuo metu yra trys būdai versti eilutes: Translate komponentas, useTranslation kabliukas arba translateEntries įrankis.

Naudojant Translate komponentą.
Išveda vertimus span elemente ir palaiko HTML atvaizdavimą.

import {Translate} from 'tacotranslate/react';

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

Elemento tipą galite pakeisti, pavyzdžiui, naudodami as="p" komponente.

Naudojant useTranslation kablį.
Grąžina vertimus kaip paprastą tekstą. Naudinga, pavyzdžiui, meta žymose.

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>
	);
}

Naudojant translateEntries įrankį.
Išversti eilutes serverio pusėje. Sustiprinkite savo OpenGraph vaizdus.

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)
	};
}

Kai eilutės pasiekia mūsų serverius, mes pirmiausia jas patikriname ir išsaugome, tada iš karto suteikiame mašininį vertimą. Nors mašininiai vertimai paprastai yra mažesnės kokybės, palyginti su mūsų AI vertimais, jie suteikia greitą pradinį atsaką.

Vienu metu pradedame asinchroninį vertimo užduotį, kad sugeneruotume aukštos kokybės, pažangų AI vertimą jūsų tekstui. Kai AI vertimas bus paruoštas, jis pakeis mašininį vertimą ir bus pateiktas kiekvieną kartą, kai prašysite savo tekstų vertimų.

Jei rankiniu būdu išvertėte tekstą, tie vertimai turi pirmenybę ir vietoj to yra grąžinami.

Naudojant kilmės vietas

TacoTranslate projektuose yra tai, ką mes vadiname šaknys. Galvokite apie jas kaip įėjimo taškus, aplankus ar grupes jūsų tekstams ir vertimams.

import {TacoTranslate} from 'tacotranslate/react';

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

Šaknys leidžia atskirti tekstus į prasmingas saugyklas. Pavyzdžiui, galite turėti vieną šaknį dokumentacijai, o kitą – savo marketingo puslapiui.

Norint tiksliau valdyti, galite nustatyti origins komponento lygyje.

Norėdami tai pasiekti, apsvarstykite galimybę naudoti kelis TacoTranslate tiekėjus savo projekte.

Atkreipkite dėmesį, kad ta pati eilutė gali turėti skirtingus vertimus skirtinguose šaltiniuose.

Galiausiai, kaip atskirsite tekstus į originus, priklauso nuo jūsų ir jūsų poreikių. Tačiau atkreipkite dėmesį, kad daug tekstų viename origine gali padidinti įkėlimo laiką.

Kintamųjų tvarkymas

Jūs visada turėtumėte naudoti kintamuosius dinaminiam turiniui, tokiam kaip vartotojų vardai, datos, el. pašto adresai ir kt.

Kintamieji eilutėse deklaruojami naudojant dvigubas skliausteles, pavyzdžiui, {{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}});
}

HTML turinio valdymas

Pagal numatytuosius nustatymus Translate komponentas palaiko ir atvaizduoja HTML turinį. Tačiau galite atsisakyti šio elgesio nustatydami useDangerouslySetInnerHTML į false.

Rinktis išjungti HTML atvaizdavimą yra labai rekomenduojama verčiant nepatikimą turinį, pavyzdžiui, vartotojų generuotą turinį.

Visa išvestis visada yra valoma naudojant sanitize-html prieš pateikiant.

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}
		/>
	);
}

Aukščiau pateiktas pavyzdys bus pateiktas kaip paprastas tekstas.

Serverio pusės renderinimas

Naudojant TacoTranslate

Kaip verčiamos eilutės

Naudojant kilmės vietas

Kintamųjų tvarkymas

HTML turinio valdymas