# General Translation Knowledge Base: ¿Cómo traduzco una aplicación Vue? URL: https://generaltranslation.com/es/kb/translate-vue-app.mdx Docs index: https://generaltranslation.com/llms.txt Description: Traducir una aplicación Vue implica que cada cadena de las plantillas se obtenga mediante una búsqueda según el idioma activo y se traduzca a cada idioma de destino. El plugin gt-vue de General Translation traduce el contenido envuelto en el componente ``, y npx gt translate genera un catálogo por cada idioma de destino. Category: Internacionalización Last updated: 2026-10-21 Authors: Kevin Liu, Kevin Wu Published: 2026-10-21 Traducir una aplicación Vue implica internacionalizarla (prepararla para mostrar cada cadena, plural, número y fecha en el idioma activo) y, después, traducir cada cadena a cada idioma de destino. Cada cambio de redacción modifica el texto de origen, así que las traducciones se van quedando desactualizadas con cada lanzamiento si no se vuelven a generar. Además, la gramática varía de un idioma a otro (el inglés tiene 2 formas plurales; el árabe, 6), y la página debe volver a renderizarse cuando el usuario cambia de idioma. ## 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 s) 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. ## Formas de traducir una aplicación Vue | Enfoque | Lo que hace bien | Lo que te deja a ti | | -------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Solo una biblioteca de internacionalización (i18n) ([`vue-i18n`](/kb/general-translation-vs-vue-i18n)) | Busca mensajes por clave con `$t`, cambia la configuración regional al vuelo, selecciona formas plurales y da formato a números y fechas según la configuración regional | Inventar una clave para cada cadena, mover el texto a un archivo de mensajes por idioma, definir `pluralRules` personalizadas para idiomas como el ruso y escribir todas las traducciones | | `@nuxtjs/i18n` (Nuxt) | Se basa en `vue-i18n` y añade rutas con prefijo de configuración regional, detección del idioma del navegador, carga diferida de traducciones y etiquetas hreflang | Las mismas claves, archivos de mensajes y traducciones que `vue-i18n` te deja a ti | | Un sistema de gestión de traducciones ([Crowdin](/kb/general-translation-vs-crowdin), [Lokalise](/kb/general-translation-vs-lokalise)) | Un editor web, sincronizado con tus archivos de mensajes, donde los traductores trabajan con un glosario y una memoria de traducción | Las claves y los archivos de mensajes en el código, la configuración inicial de la sincronización y esperar a los traductores antes de cada lanzamiento | | General Translation (`gt-vue` y la CLI `gt`) | [``](/docs/vue/reference/components/t) traduce el contenido de las plantillas en el propio contenido, sin claves; [``](/docs/vue/reference/components/plural) dentro de [``](/docs/vue/reference/components/t) elige la forma plural de cada configuración regional según las reglas de CLDR; [`npx gt translate`](/docs/cli/reference/commands/translate) genera un catálogo por idioma de destino; [`useSetLocale()`](/docs/vue/reference/composables/use-set-locale) cambia el idioma sin recargar la página | Envolver el contenido de las plantillas en [``](/docs/vue/reference/components/t) y hacer una configuración inicial única (archivo de configuración, cargador y plugin); volver a ejecutar [`npx gt translate`](/docs/cli/reference/commands/translate) cuando cambie el contenido de origen; seguir los cambios de la API entre las versiones 0.x | Usa solo `vue-i18n` cuando tengas pocas cadenas y estables, o ya estén traducidas en archivos de mensajes, y añade `@nuxtjs/i18n` en una aplicación Nuxt que necesite rutas localizadas. Usa un sistema de gestión de traducciones cuando un equipo de localización traduzca a mano cada lanzamiento. Usa `gt-vue` cuando las plantillas cambien en cada lanzamiento y quieras generar las traducciones a partir del código, sin claves que mantener sincronizadas. ## Traducir una aplicación Vue con gt-vue El paquete `gt-vue` de General Translation funciona como un plugin de Vue, y la CLI `gt` se encarga de generar las traducciones. 1. En `gt.config.json`, define tu idioma de origen en `defaultLocale`, tus idiomas de destino en `locales` y la ruta del catálogo en `files.gt.output`. 2. Registra el plugin [`createGT()`](/docs/vue/reference/functions/create-gt) antes de montar la aplicación. 3. Envuelve el contenido de la plantilla en el componente [``](/docs/vue/reference/components/t). Para las cadenas independientes, como el marcador de posición de un campo de entrada, usa la función que devuelve [`useGT()`](/docs/vue/reference/composables/use-gt). ```vue ``` 4. Inicia sesión con [`npx gt login`](/docs/cli/reference/commands/login) y configura el ID del proyecto. 5. Ejecuta [`npx gt translate`](/docs/cli/reference/commands/translate), que analiza el código fuente de Vue y genera un catálogo JSON por cada idioma de destino en la ruta `files.gt.output`. La CLI extrae la estructura de la plantilla, de modo que el texto, los elementos anidados y el formato se traducen como una sola unidad. La prop `context` de [``](/docs/vue/reference/components/t) indica si «Open» es un verbo o un adjetivo. ## Traduce en cada compilación Añade [`npx gt translate`](/docs/cli/reference/commands/translate) antes de `vite build` en tu script de compilación y define `GT_PROJECT_ID` y `GT_API_KEY` en el entorno de compilación para que cada despliegue incluya los catálogos actualizados. El [Inicio rápido de Vue](/docs/vue/quickstart) recoge todos los pasos, incluidos el cargador de traducciones y un selector de idioma. ## Related questions - [¿Cómo traduzco una aplicación de React?](https://generaltranslation.com/es/kb/translate-react-app.mdx): Traducir una aplicación de React significa internacionalizar sus componentes para que se rendericen en el idioma del usuario y, después, traducir cada cadena a todos los idiomas que admitas. gt-react de General Translation traduce JSX en el mismo documento con el componente ``, y npx gt translate genera un archivo por idioma. - [¿Cómo agrego i18n a una aplicación de Next.js con App Router?](https://generaltranslation.com/es/kb/add-i18n-to-nextjs.mdx): Empieza con gt init para configurar General Translation en un proyecto compatible con App Router; luego marca el contenido de origen, genera las traducciones y verifica el cambio de idioma. gt-next mantiene el texto en JSX junto con el contexto de traducción; la CLI, el editor del panel de control y Locadex se encargan de la generación, la revisión y las actualizaciones continuas. Esta guía también muestra la configuración inicial explícita con archivos locales. - [¿Puedo hacer i18n sin archivos de traducción?](https://generaltranslation.com/es/kb/i18n-without-translation-files.mdx): Sí. Las bibliotecas gt-react y gt-next de General Translation permiten hacer i18n en React y Next.js sin claves de traducción y sin tener que mantener un archivo JSON por idioma. El texto permanece inline en JSX dentro del componente ``, y el comando gt translate genera las traducciones de cada idioma durante la compilación, con contexto extraído de tu código. Locadex puede mantenerlas al día mediante pull requests. - [¿Cómo mantengo las traducciones actualizadas en cada despliegue?](https://generaltranslation.com/es/kb/translations-in-ci.mdx): Ejecuta la traducción como un paso del flujo antes de cada compilación de producción, para que el texto nuevo se publique ya traducido en el mismo despliegue que lo incorpora. La CLI gt de General Translation lo hace con npx gt translate, usando una clave de API del proyecto y el ID del proyecto almacenados como secretos de CI. ## Previous and next questions - Previous question: [¿Cómo traduzco una aplicación de React?](https://generaltranslation.com/es/kb/translate-react-app.mdx) - Next question: [¿Cómo traduzco una app de React Native?](https://generaltranslation.com/es/kb/translate-react-native-app.mdx) ## Sitemap See the [Knowledge Base sitemap](https://generaltranslation.com/es/kb/sitemap.md) for every article.