Wrap Vue templates for vue-i18n automatically

Polyglot wraps Vue SFCs with vue-i18n's native shapes — and if your app already uses vue-i18n, it detects your catalog's location and format and merges into it rather than inventing a parallel one.

The transformation

<template>
  <main>
    <h1>Welcome back</h1>
    <p>Your projects are ready</p>
  </main>
</template>

<script setup lang="ts">
import { useI18n } from 'vue-i18n';
const { t } = useI18n();
</script>

<template>
  <main>
    <h1>{{ t('src.App.welcome_back') }}</h1>
    <p>{{ t('src.App.your_projects_are_ready') }}</p>
  </main>
</template>

• Template text becomes {{ $t('key') }}; bound attributes get :attr="$t('key')" conversions.
• Components that need it get the useI18n binding so both template and script resolve.
• Rich inline formatting (text with <strong>/links inside) is flagged for review with the exact reason, never approximated — rich-text codegen ships for the React family; in Vue, Polyglot won't guess at markup.

Setup, scaffolded and wired

On a fresh app Polyglot creates the i18n instance and wires app.use(i18n) into src/main.ts — then verifies that wiring as part of the run:

{
  "src": {
    "App": {
      "welcome_back": "Welcome back",
      "your_projects_are_ready": "Your projects are ready"
    }
  }
}

{
  "src": {
    "App": {
      "welcome_back": "Willkommen zurück",
      "your_projects_are_ready": "Ihre Projekte sind bereit"
    }
  }
}

{
  "src": {
    "App": {
      "welcome_back": "Bon retour",
      "your_projects_are_ready": "Vos projets sont prêts"
    }
  }
}

Try it

$ curl -fsSL https://getpolyglot.ai/install.sh | sh
$ polyglot init --framework vue
$ polyglot scan
$ polyglot wrap
$ polyglot translate --languages de   # 50 strings free, no signup