TacoTranslate
/
DokumentasjonPrisar
 
  1. Innleiing
  2. Kom i gang
  3. Oppsett og konfigurasjon
  4. Bruke TacoTranslate
  5. Serverside-gjengjeving
  6. Avansert bruk
  7. Beste praksisar
  8. Feilhandsaming og feilsøking
  9. Støtta språk

Bruke TacoTranslate

Omsetjing av strengar

Det finst for tida tre måtar å omsetje strengar på: Komponenten Translate, hooken useTranslation, eller verktøyet translateEntries.


Bruke Translate komponenten.
Returnerer omsetjingar i eit span element, og støttar HTML-gjengjeving.

import {Translate} from 'tacotranslate/react';

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

Du kan endre elementtypen ved å bruke til dømes as="p" på komponenten.


Bruke useTranslation hooken.
Returnerer omsetjingar som ein enkel tekststreng. Nyttig til dømes i meta taggar.

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

Bruke translateEntries-verktøyet.
Oversett strengar på serversida. Gi OpenGraph bileta dine eit kraftig løft.

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

Korleis strengar vert omsette

Når strengar kjem til serverane våre, validerer og lagrar vi dei fyrst, og returnerer med ein gong ei maskinomsetjing. Sjølv om maskinomsetjingar vanlegvis har lågare kvalitet enn AI-omsetjingane våre, gir dei eit raskt innleiande svar.

Samstundes startar vi eit asynkront omsetjingsoppdrag for å lage ein høgkvalitets, toppmoderne AI-omsetjing av tekststrengen din. Når AI-omsetjinga er klar, vil ho erstatte maskinomsetjinga og bli sendt kvar gong du ber om omsetjingar for strengane dine.

Om du har omsett ein streng manuelt, går desse omsetjingane føre, og dei blir returnerte i staden.

Bruke opprinnelsar

TacoTranslate-prosjekt inneheld det vi kallar origins. Sjå på dei som inngangspunkt, mappar eller grupper for strengane og omsetjingane dine.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins lar deg organisere strengar i meiningsfulle grupper. Til dømes kan du ha ein origin for dokumentasjonen og ein annan for marknadssida di.

For meir granulær kontroll kan du sette opp origins på komponentnivå.

For å oppnå dette, vurder å bruke fleire TacoTranslate leverandørar i prosjektet ditt.

Merk at den same strengen kan få ulike omsetjingar i ulike opprinnelsar.

Til slutt er det opp til deg og behova dine korleis du delar strengar inn i originar. Merk likevel at å ha mange strengar i ein origin kan auke lastetida.

Handsaming av variablar

Du bør alltid bruke variablar for dynamisk innhald, som brukarnamn, datoar, e-postadresser og meir.

Variablar i strengar vert deklarert med doble klammer, som {{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}});
}

Handtering av HTML-innhald

Som standard støttar Translate komponenten og viser HTML-innhald. Du kan likevel velje å ikkje bruke denne oppførselen ved å sette useDangerouslySetInnerHTML til false.

Det er sterkt tilrådd å slå av HTML-gjengiving når ein omset innhald som ein ikkje kan stole på, som til dømes brukargenerert innhald.

All utdata vert alltid sanitert med sanitize-html før dei vert vist.

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

Dømet ovanfor vil bli vist som vanleg tekst.

Serverside-gjengjeving

Eit produkt frå NattskiftetLaga i Noreg