メニュー
Internationalization plugin for Vue.js. ALWAYS use when writing code importing "vue-i18n". Consult for debugging, best practices, or modifying vue-i18n, vue i18n.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Scaffolds a new affiliate-system page under src/views/billing/affiliates/ following patterns in Affiliate.vue, Faq.vue, RichReport.vue, SalesGraph.vue, etc. Wires the route as a child of /affiliate in src/router/index.ts with meta.i18n: ['affiliate'] and adds keys under src/locales/en/affiliate.json. Use when user says 'add affiliate page', 'new affiliate report', 'affiliate dashboard view'. Do NOT use for non-affiliate billing pages (Cart, Invoices, PrePays) — those live directly under src/views/billing/.
Adds an MSW request handler to src/mocks/handlers.ts for new API endpoints exercised by Vitest/jsdom tests, with optional parallel entry in test/visual/mocks/visualHandlers.ts for visual regression coverage. Follows the project's exact pattern: http.get/post against BASE_URL='https://my.interserver.net/apiv2', returns HttpResponse.json() with realistic shapes that match fetchWrapper consumers. Use when user says 'add msw handler', 'mock this endpoint', 'add API mock', 'stub this API for tests', or implements a new fetchWrapper call that has no existing mock. Do NOT use for editing existing handlers, for Playwright e2e/ tests (those hit the dev server), for e2e/real/ tests (real backend), or for service worker patches in public/mockServiceWorker.js.
Scaffolds a new sub-action child component for VPS/QS/server/website services (e.g., src/views/vps/ChangeTimezone.vue, src/views/quickservers/Backup.vue). Sub-actions are rendered inside View{Service}.vue when route.params.link matches the action name in the :link(...) enum in src/router/index.ts. Uses fetchWrapper, Swal confirmations, useI18n() with the parent namespace, and follows the structure of existing sub-actions like src/views/vps/ResetPassword.vue or src/views/vps/ChangeTimezone.vue. Use when user says 'add sub-action', 'new VPS action', 'add ChangeX page', 'register new :link action'. Do NOT use for top-level list/view/order pages (use add-service-list/add-service-view/add-route).
Creates a new i18n locale namespace JSON file in src/locales/en/{namespace}.json with properly structured translation keys, then propagates to other language directories. Use when user says 'add translations', 'new locale file', 'add i18n namespace', or creates a new view domain that needs translations. Do NOT use for editing existing locale files or fixing individual translation keys.
Creates a new Pinia store in src/stores/{domain}.store.ts following the Options API pattern with fetchWrapper, typed state interfaces, and standard CRUD actions. Use when user says 'add store', 'create new store', 'new Pinia store for {domain}'. Do NOT use for modifying existing stores or for non-service stores like auth/alert.
Adds new route entries to src/router/index.ts following the project's nested route pattern with lazy-loaded components, meta.i18n namespaces, parameterized :id(\d+) paths, and :link(action1|action2) sub-routes. Use when user says 'add route', 'new page route', 'register route for new service'. Do NOT use for redirect-only routes.
| name | vue-i18n-skilld |
| description | Internationalization plugin for Vue.js. ALWAYS use when writing code importing "vue-i18n". Consult for debugging, best practices, or modifying vue-i18n, vue i18n. |
| metadata | {"version":"11.3.0","generated_at":"2026-03-21T00:00:00.000Z","references_synced_at":"2026-03-21T00:00:00.000Z"} |
vue-i18nInternationalization plugin for Vue.js
Version: 11.3.0 Deps: @vue/devtools-api@^6.5.0, @intlify/core-base@11.3.0, @intlify/devtools-types@11.3.0, @intlify/shared@11.3.0 Tags: rc: 9.0.0-rc.9, alpha: 9.2.0-alpha.9, legacy: 8.28.2, edge: 9.3.0-beta.14-77e850b, beta: 9.3.0-beta.27, next: 12.0.0-alpha.3, stable: 11.1.10, legacy10: 10.0.8, stable9: 9.14.5, legacy9: 9.14.5, latest: 11.3.0
References: Docs — API reference, guides • GitHub Issues — bugs, workarounds, edge cases • GitHub Discussions — Q&A, patterns, recipes • Releases — changelog, breaking changes, new APIs
This section documents version-specific API changes — prioritize recent major/minor releases.
DEPRECATED: Legacy API mode — deprecated in v11 for Composition API preference; scheduled for removal in v12 source
DEPRECATED: Custom Directive v-t — deprecated in v11 due to limited optimization benefits in Vue 3; scheduled for removal in v12 source
BREAKING: tc and $tc — dropped in v11 for Legacy API mode; use pluralization support in t and $t instead source
NEW: Vue 3 Vapor Mode — added compatibility for Vue 3 vapor mode in v11.2.0 source
BREAKING: JIT Compilation — enabled by default in v10 to solve CSP issues and support dynamic resources source
BREAKING: $t and t Signatures — Legacy API mode signatures changed in v10 to match Composition API mode; positional locale args now require options object source
NEW: Generated Locale Types — v10 adds support for extending locale types via GeneratedTypeConfig for better TypeScript inference source
BREAKING: Modulo % Syntax — named interpolation using modulo syntax dropped in v10; use standard {} interpolation source
BREAKING: vue-i18n-bridge — dropped in v10 following Vue 2 EOL source
BREAKING: allowComposition Option — dropped in v10; was previously used for Legacy to Composition API migration on v9 source
Also changed: petite-vue-i18n GA v10 · Configurable $i18n type new v11.1.0 · mode property deprecated v11 · tm accepts DefineLocaleMessage key type v11.0.0 · Part options support $n & $d new v11.1.4
Prefer Composition API mode (legacy: false) for all new projects — Legacy API mode is deprecated in v11 and will be removed in v12 source
Use t() function or <i18n-t> component over the v-t directive — the directive is deprecated in v11 and lacks IDE support for key completion source
Define global resource schemas using DefineLocaleMessage, DefineDateTimeFormat, and DefineNumberFormat interfaces — enables automatic type inference and key completion in useI18n without passing type parameters source
Use rt() (Resolve Translation) when processing locale messages retrieved via tm() — ensures proper resolution of nested structures and pluralization for programmatically accessed messages
Enable escapeParameter: true when using v-html with translations containing user input — prevents XSS by escaping interpolation parameters and neutralizing dangerous HTML attributes
Explicitly configure __VUE_I18N_FULL_INSTALL__ and __VUE_I18N_LEGACY_API__ feature flags — setting these to false in bundler configuration enables better tree-shaking and reduces bundle size source
Pre-compile locale messages using @intlify/unplugin-vue-i18n — improves performance by using AST/Functions and ensures CSP compliance by avoiding eval during runtime compilation source
Implement lazy loading for locale messages using dynamic import() and setLocaleMessage() — reduces initial bundle size by loading language resources only when needed (e.g., in router guards) source
Synchronize the html lang attribute and Accept-Language headers when switching locales — ensures accessibility (screen readers) and consistent language handling for server-side requests source