Dokumentacija: Kaip naudoti TacoTranslate

TacoTranslate naudojimas

Lithuanian

Tekstų vertimas

Šiuo metu yra trys būdai versti eilutės: Translate komponentas, useTranslation hook'as, 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 hooką.
Grąžina vertimus kaip paprastą eilutę. Naudinga, pavyzdžiui, meta žymėms.

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į.
Versti eilutes serverio pusėje. Pagerinkite 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 jas pirmiausia patikriname ir išsaugome, o tada nedelsdami grąžiname mašininį vertimą. Nors mašininiai vertimai paprastai būna žemesnės kokybės nei mūsų dirbtinio intelekto vertimai, jie suteikia greitą pradinį atsakymą.

Tuo pačiu metu mes inicijuojame asinchroninę vertimo užduotį, kad sugeneruotume aukštos kokybės, naujausios kartos AI vertimą jūsų eilutei. Kai AI vertimas bus paruoštas, jis pakeis mašininį vertimą ir bus siunčiamas kiekvieną kartą, kai paprašysite savo eilučių vertimų.

Jei eilutę išvertėte rankiniu būdu, tie vertimai turi pirmenybę ir bus pateikti.

Originų naudojimas

TacoTranslate projektai apima tai, ką mes vadiname originais. Galvokite apie juos kaip apie įėjimo taškus, aplankus arba grupes jūsų eilutėms ir vertimams.

import {TacoTranslate} from 'tacotranslate/react';

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

Šaltiniai leidžia atskirti teksto eilutes į prasmingus konteinerius. Pavyzdžiui, galite turėti vieną šaltinį dokumentacijai ir kitą — jūsų rinkodaros puslapiui.

Norėdami tikslesnės kontrolės, galite komponento lygyje nustatyti origins.

Norėdami tai pasiekti, apsvarstykite naudoti kelis TacoTranslate teikėjus savo projekte.

Atkreipkite dėmesį, kad ta pati eilutė gali būti išversta skirtingai skirtinguose originuose.

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

Kintamųjų valdymas

Visada turėtumėte naudoti kintamuosius dinamiškam turiniui, pvz., vartotojų vardams, datoms, el. pašto adresams ir kt.

Kintamieji eilutėse deklaruojami naudojant dvigubus skliaustus, 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.

Labai rekomenduojama išjungti HTML atvaizdavimą verčiant nepatikimą turinį, pavyzdžiui, vartotojų sukurtą turinį.

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

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 atvaizduotas kaip paprastas tekstas.

Serverio pusės atvaizdavimas

TacoTranslate naudojimas

Kaip verčiamos eilutės

Originų naudojimas

Kintamųjų valdymas

HTML turinio valdymas