# General Translation Knowledge Base: Как перевести приложение на Vue? URL: https://generaltranslation.com/ru/kb/translate-vue-app.mdx Docs index: https://generaltranslation.com/llms.txt Description: Чтобы перевести приложение на Vue, нужно заменить каждую строку шаблона поиском по ключу для активного языка и перевести её на все языки перевода. Плагин gt-vue от General Translation переводит контент, обёрнутый в компонент ``, а npx gt translate создаёт отдельный каталог для каждого языка перевода. Category: Интернационализация Last updated: 2026-10-21 Authors: Kevin Liu, Kevin Wu Published: 2026-10-21 Чтобы перевести приложение на Vue, его нужно сначала интернационализировать (подготовить к отображению каждой строки, формы множественного числа, числа и даты на активном языке), а затем перевести каждую строку на все языки перевода. Любая правка текста меняет исходный текст, поэтому, если переводы не генерировать заново, они будут отставать с каждым релизом. Кроме того, грамматика у языков разная (в английском 2 формы множественного числа, в арабском — 6), а при переключении языка страница должна выполнять повторный рендеринг. ## Video The video is narrated in English, with English captions. [How do I translate a Vue app?](https://caxecubb9c64cezv.public.blob.vercel-storage.com/films/kb-translate-vue-app.mp4) (48 с) General Translation lets you register the `gt-vue` plugin and wrap your template in `T`. List your languages, register the plugin before the app mounts, run `npx gt translate`, and add a switcher built on `useSetLocale`. The `gt-vue` package is a 0.x release whose API may still change. ## Способы перевести приложение на Vue | Подход | Сильные стороны | Что остаётся на вас | | ------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Только библиотека интернационализации (i18n) ([`vue-i18n`](/kb/general-translation-vs-vue-i18n)) | Ищет сообщения по ключу через `$t`, переключает локаль на месте, выбирает формы множественного числа и форматирует числа и даты для каждой локали | Придумывать ключ для каждой строки, переносить текст в отдельный файл сообщений для каждого языка, писать пользовательские `pluralRules` для таких языков, как русский, и самостоятельно делать все переводы | | `@nuxtjs/i18n` (Nuxt) | Построен на основе `vue-i18n` и добавляет маршруты с префиксом локали, определение языка браузера, ленивую загрузку переводов и теги hreflang | Те же ключи, файлы сообщений и переводы, что и в случае с `vue-i18n` | | Система управления переводами ([Crowdin](/kb/general-translation-vs-crowdin), [Lokalise](/kb/general-translation-vs-lokalise)) | Веб-редактор, синхронизированный с вашими файлами сообщений, в котором переводчики работают с глоссарием и памятью переводов | Ключи и файлы сообщений в коде, настройка синхронизации и ожидание переводчиков перед каждым релизом | | General Translation (`gt-vue` и CLI `gt`) | [``](/docs/vue/reference/components/t) переводит содержимое шаблона на месте, без ключей; [``](/docs/vue/reference/components/plural) внутри [``](/docs/vue/reference/components/t) выбирает форму множественного числа для каждой локали по правилам CLDR; [`npx gt translate`](/docs/cli/reference/commands/translate) создаёт каталог для каждого языка перевода; [`useSetLocale()`](/docs/vue/reference/composables/use-set-locale) переключает язык без перезагрузки страницы | Обернуть содержимое шаблона в [``](/docs/vue/reference/components/t) и один раз выполнить настройку (конфигурация, загрузчик и плагин); заново запускать [`npx gt translate`](/docs/cli/reference/commands/translate) при изменении исходного содержимого; следить за изменениями API между релизами 0.x | Используйте только `vue-i18n`, если строк немного и они редко меняются или уже переведены в файлах сообщений; в приложении на Nuxt, которому нужны локализованные маршруты, добавьте `@nuxtjs/i18n`. Выбирайте систему управления переводами, если команда локализации переводит каждый релиз вручную. Используйте `gt-vue`, если шаблоны меняются с каждым релизом и вы хотите генерировать переводы прямо из кода, не поддерживая синхронизацию ключей. ## Перевод приложения Vue с помощью gt-vue Пакет `gt-vue` от General Translation работает как плагин Vue, а переводы генерирует CLI `gt`. 1. В `gt.config.json` укажите язык-источник в `defaultLocale`, целевые языки — в `locales`, а путь к каталогу — в `files.gt.output`. 2. Зарегистрируйте плагин [`createGT()`](/docs/vue/reference/functions/create-gt) перед монтированием приложения. 3. Оберните содержимое шаблона в компонент [``](/docs/vue/reference/components/t). Для отдельных строк, например плейсхолдера поля ввода, используйте функцию из [`useGT()`](/docs/vue/reference/composables/use-gt). ```vue ``` 4. Войдите в систему с помощью [`npx gt login`](/docs/cli/reference/commands/login) и укажите идентификатор проекта. 5. Выполните [`npx gt translate`](/docs/cli/reference/commands/translate): команда просканирует исходный код Vue и запишет по пути `files.gt.output` отдельный JSON-каталог для каждого языка перевода. CLI извлекает структуру шаблона целиком, поэтому текст, вложенные элементы и форматирование переводятся как единое целое. Проп `context` компонента [``](/docs/vue/reference/components/t) позволяет уточнить, является ли «Open» глаголом или прилагательным. ## Перевод при каждой сборке Добавьте [`npx gt translate`](/docs/cli/reference/commands/translate) перед `vite build` в скрипт сборки и задайте `GT_PROJECT_ID` и `GT_API_KEY` в среде сборки — тогда при каждом развёртывании будут поставляться актуальные каталоги. Подробные шаги, включая настройку загрузчика переводов и переключателя языка, приведены в разделе [Быстрый старт с Vue](/docs/vue/quickstart). ## Related questions - [Как перевести React-приложение?](https://generaltranslation.com/ru/kb/translate-react-app.mdx): Перевод React-приложения состоит из двух этапов — интернационализации компонентов, чтобы они отображались на языке пользователя, и перевода каждой строки на все поддерживаемые языки. gt-react от General Translation переводит JSX на месте в компоненте ``, а npx gt translate создаёт по одному файлу на каждый язык. - [Как добавить i18n в приложение Next.js на App Router?](https://generaltranslation.com/ru/kb/add-i18n-to-nextjs.mdx): Начните с gt init, чтобы настроить General Translation в поддерживаемом проекте на App Router, затем разметьте исходное содержимое, создайте переводы и проверьте переключение языка. gt-next хранит тексты прямо в JSX вместе с контекстом перевода, а CLI, редактор в панели управления и Locadex берут на себя генерацию, проверку и последующие обновления. В этом руководстве также показана явная настройка с локальными файлами. - [Можно ли делать i18n без файлов перевода?](https://generaltranslation.com/ru/kb/i18n-without-translation-files.mdx): Да. Библиотеки gt-react и gt-next от General Translation обеспечивают i18n для React и Next.js без ключей перевода и без отдельного JSON-файла для каждого языка, который приходится поддерживать. Тексты остаются встроенными в JSX внутри компонента ``, а команда gt translate генерирует переводы для каждого языка во время сборки, учитывая контекст из вашего кода. Locadex может поддерживать их в актуальном состоянии через пул-реквесты. - [Как поддерживать переводы в актуальном состоянии при каждом развёртывании?](https://generaltranslation.com/ru/kb/translations-in-ci.mdx): Запускайте перевод как этап конвейера перед каждой сборкой для рабочей среды — тогда новые тексты попадут в то же развёртывание, что и сами изменения, уже переведёнными. В CLI gt от General Translation для этого служит команда npx gt translate, которая использует ключ API проекта и идентификатор проекта, сохранённые как секреты CI. ## Previous and next questions - Previous question: [Как перевести приложение на React Native?](https://generaltranslation.com/ru/kb/translate-react-native-app.mdx) - Next question: [Как перевести сайт документации на Mintlify?](https://generaltranslation.com/ru/kb/translate-mintlify-docs.mdx) ## Sitemap See the [Knowledge Base sitemap](https://generaltranslation.com/ru/kb/sitemap.md) for every article.