TacoTranslate
/
БаримтжуулалтҮнийн мэдээлэл
 
  1. Танилцуулга
  2. Эхлэх
  3. Тохиргоо ба тохируулга
  4. TacoTranslate-ийг ашиглах
  5. Сервер талын рендеринг
  6. Ахисан түвшний хэрэглээ
  7. Шилдэг туршлага
  8. Алдааны удирдлага ба алдааг илрүүлэх
  9. Дэмжигдсэн хэлүүд

TacoTranslate-ийг ашиглах

Мөрүүдийг орчуулах

Одоогоор мөрүүдийг орчуулах гурван арга байна: Translate бүрэлдэхүүн хэсэг, useTranslation hook эсвэл translateEntries хэрэгсэл.


Translate бүрэлдэхүүн хэсгийг ашиглах.
Орчуулгыг span элементийн дотор гаргаж, HTML дүрслэхийг дэмждэг.

import {Translate} from 'tacotranslate/react';

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

Та жишээ нь, компонентийн дээр as="p" ашиглан элементийн төрлийг өөрчилж болно.


useTranslation hook-ыг ашиглах.
Орчуулгыг энгийн текст хэлбэрээр буцаана. Жишээлбэл, meta шошгууд дээр ашиглахад тохиромжтой.

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

translateEntries хэрэгслийг ашиглах.
Утгуудыг сервер тал дээр орчуулах. Таны OpenGraph зургуудыг илүү хүчирхэг болгоно.

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

Утгууд хэрхэн орчуулагддаг вэ

Стрингүүд серверт ирэхэд бид эхлээд тэдгээрийг шалгаж хадгалдаг бөгөөд дараа нь машин орчуулгыг шууд буцаан өгдөг. Машин орчуулгууд ерөнхийдөө манай AI орчуулгуудтай харьцуулахад чанар муутай байдаг ч хурдан анхны хариу өгдөг.

Үүний зэрэгцээ бид таны мөрийн өндөр чанартай, дэвшилтэт AI орчуулгыг үүсгэх зорилгоор асинхрон орчуулгын ажлыг эхлүүлдэг. AI орчуулга бэлэн болсон үед, энэ нь машин орчуулгыг орлож таны мөрүүдийн орчуулгыг хүссэн үед илгээгдэх болно.

Хэрэв та гараар орчуулсан мөртэй бол тухайн орчуулгууд давамгайлах бөгөөд орлуулан буцааж өгөгдөх болно.

Үүсэл ашиглах

TacoTranslate төслүүд нь бид origins гэж нэрлэдэг зүйлсийг агуулдаг. Үүнийг таны мөрүүд болон орчуулгуудын орох цэг, хавтас, эсвэл бүлгүүд гэж төсөөлөөрэй.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins нь таны текстүүдийг утга учиртай хэсгүүдэд хуваах боломжийг олгодог. Жишээ нь, та нэг origin-ийг баримт бичгийн хувьд, нөгөө origin-ийг таны маркетингийн хуудсанд ашиглаж болно.

Илүү нарийн хяналт тавихын тулд үндсүүдийг бүрэлдэхүүн хэсгийн түвшинд тохируулж болно.

Үүнийг хэрэгжүүлэхийн тулд, төслийнхөө хүрээнд олон TacoTranslate нийлүүлэгч ашиглах-ыг сонирхоорой.

Анхаарна уу, нэгэн ижил гэмтэл өөр өөр эх сурвалжуудад өөр өөр орчуулга авч болно.

Эцэст нь, мөрүүдийг origins-д хэрхэн ангилах нь таны ба таны хэрэгцээнд хамаарна. Гэсэн хэдий ч, нэг origin дотор олон мөр байх нь ачааллын хугацааг уртасгаж болзошгүйг анхаарна уу.

Тогтмол хувьсагчидтай ажиллах

Та динамик агуулгын хувьд, жишээлбэл хэрэглэгчийн нэр, огноо, цахим шуудангийн хаяг болон бусад зүйлсэд үргэлж хувьсагч ашиглах хэрэгтэй.

Тогтмол утгуудыг мөрүүдэд хоёр давхар тэгш өнцөгт хаалт ашиглан зарладаг, жишээлбэл {{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 агуулгыг удирдах

Анхдагчаар, Translate бүрэлдэхүүн хэсэг нь HTML агуулгыг дэмжиж, үүнийг дүрслэн харуулдаг. Гэхдээ та энэ үйлдлээс гарахын тулд useDangerouslySetInnerHTML утгыг false болгож тохируулах боломжтой.

HTML дүрслэлийг идэвхгүй болгох нь хэрэглэгчийн үүсгэсэн агуулга зэрэг найдвартай бус агуулгыг орчуулахдаа хүчтэй зөвлөгддөг.

Гаралт бүр нь дүрслэгдэхээс өмнө үргэлж sanitize-html ашиглан ариутгагддаг.

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

Дээрх жишээ нь энгийн текст болгон үзүүлэгдэх болно.

Сервер талын рендеринг

Nattskiftet -аас гаргасан бүтээгдэхүүнНорвегид үйлдвэрлэв