Lingo.dev + .html (Веб)
Lingo.dev CLI переводит HTML-файлы, сохраняя структуру разметки, атрибуты и семантические элементы для веб-сайтов и документации. CLI сохраняет всю HTML-разметку и вложенность, обрабатывает только переводимые атрибуты, защищает JavaScript и CSS от перевода, корректно работает с семантическими элементами HTML5 и гарантирует валидный HTML-вывод.
Быстрая настройка
Настройте для HTML-файлов с организацией на основе локалей:
{
"locale": {
"source": "en",
"targets": ["es", "fr", "de"]
},
"buckets": {
"html": {
"include": ["content/[locale]/*.html"]
}
}
}
Напоминание: [locale] — это плейсхолдер, который должен оставаться в конфигурации буквально, так как он заменяется на фактическую локаль во время выполнения CLI.
Перевод HTML-файлов
npx lingo.dev@latest i18n
Переводит текстовый контент, сохраняя структуру HTML, теги, атрибуты и семантическую разметку.
Умная обработка HTML
Перевод контента
<!DOCTYPE html>
<html lang="en">
<head>
<title>Добро пожаловать на нашу платформу</title>
<meta
name="description"
content="Лучшая платформа для повышения продуктивности"
/>
</head>
<body>
<h1>Начало работы</h1>
<p>
Это руководство поможет вам <strong>быстро</strong> и эффективно
освоиться.
</p>
<a href="/help">Нужна помощь?</a>
</body>
</html>
Текстовый контент переводится, при этом структура HTML и теги остаются неизменными.
Обработка атрибутов
<img
src="/images/hero.jpg"
alt="Приветственный баннер"
title="Наша платформа"
/>
<input type="text" placeholder="Введите ваше имя" />
<button aria-label="Закрыть диалог">×</button>
Переводимые атрибуты, такие как alt, title, placeholder и aria-label, локализуются.
Сохранение семантики
<article>
<header>
<h2>Заголовок статьи</h2>
<time datetime="2024-01-15">15 января 2024</time>
</header>
<section>
<p>Содержимое статьи размещается здесь...</p>
</section>
</article>
Семантические элементы HTML5 и их структура сохраняются.
Расширенные возможности
Защита скриптов и стилей
<script>
function greeting() {
console.log("This stays untranslated");
}
</script>
<style>
.header {
color: blue;
}
</style>
Содержимое JavaScript и CSS остаётся нетронутым.
Атрибуты данных
<div data-message="Понятное пользователю сообщение" data-id="widget-123">
<span>Видимое содержимое переводится</span>
</div>
Атрибуты данных с переводимым содержимым обрабатываются интеллектуально.
Расширенная конфигурация
Несколько HTML-директорий
"html": {
"include": [
"content/[locale]/*.html",
"pages/[locale]/**/*.html"
]
}
Блокировка технических атрибутов
"html": {
"include": ["content/[locale]/*.html"],
"lockedKeys": ["id", "class", "data-id", "href"]
}