{"library":"petite-vue-i18n","title":"Petite Vue I18n","description":"petite-vue-i18n is a specialized, lightweight internationalization library for Vue 3 applications, offering a trimmed-down feature set compared to the full vue-i18n package. Currently at version 11.3.2, it maintains a regular release cadence with frequent bug fixes and minor improvements, often in sync with the main vue-i18n project. Its primary differentiation lies in its significantly smaller bundle size (up to 45% smaller for runtime-only builds) by exclusively supporting the Composition API and focusing solely on core translation capabilities. It omits features like date/number formatting ($n, $d), rich text rendering ($rt), hierarchical message handling out-of-the-box, the v-t directive, and components like i18n-t, making it ideal for projects where only basic text translation is required and bundle size is critical. Migration to the full vue-i18n is designed to be seamless if more features become necessary later.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install petite-vue-i18n"],"cli":null},"imports":["import { createI18n } from 'petite-vue-i18n'","import { useI18n } from 'petite-vue-i18n'","import type { Composer } from 'petite-vue-i18n'"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { createApp } from 'vue'\nimport { createI18n, useI18n } from 'petite-vue-i18n'\n\nconst messages = {\n  en: {\n    'hello world': 'Hello world from petite-vue-i18n!',\n    'greeting': 'Welcome, {name}!',\n    'about': 'This is a lightweight i18n solution.'\n  },\n  fr: {\n    'hello world': 'Bonjour le monde de petite-vue-i18n !',\n    'greeting': 'Bienvenue, {name} !',\n    'about': 'Ceci est une solution i18n légère.'\n  }\n}\n\nconst i18n = createI18n({\n  locale: 'en',\n  fallbackLocale: 'fr',\n  messages\n})\n\nconst app = createApp({\n  setup() {\n    const { t, locale } = useI18n()\n    return { t, locale }\n  },\n  template: `\n    <div id=\"app\">\n      <h1>{{ t('hello world') }}</h1>\n      <p>{{ t('greeting', { name: 'User' }) }}</p>\n      <p>{{ t('about') }}</p>\n      <button @click=\"locale = 'fr'\">Switch to French</button>\n      <button @click=\"locale = 'en'\">Switch to English</button>\n    </div>\n  `\n})\n\napp.use(i18n)\napp.mount('#app')","lang":"typescript","description":"This example demonstrates how to set up `petite-vue-i18n` with `createI18n`, use the `useI18n` hook for translations (`t`), and dynamically switch locales in a Vue 3 application.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}