How are translation keys made type-safe?

The skill provides patterns for defining TypeScript interfaces and types for your locale messages, ensuring the compiler catches missing or mistyped keys.

Does this skill support the Vue 2 Legacy API?

No, this skill is strictly optimized for Vue 3 and the Composition API. It requires setting 'legacy: false' in your configuration to support modern patterns.

Does it support lazy loading?

Yes, it includes patterns for dynamic imports and route-based locale loading to ensure your application bundle remains small and performant.

Can I use multiple useI18n calls in a single component?

No, the skill enforces a single useI18n call per component. You should destructure all needed functions like 't', 'd', and 'n' from that single instance to maintain synchronization.

Vue 3 i18n Localization

Name: Vue 3 i18n Localization
Author: agents-inc

byagents-inc

0•

開発者ツール

Implements type-safe internationalization patterns for Vue 3 applications using the Composition API and modern vue-i18n standards.

This skill provides specialized guidance for implementing robust internationalization in Vue 3 projects. It focuses on the modern Composition API approach, enforcing best practices like type-safe translation keys, single-composable patterns, and strict configuration requirements. From basic message interpolation to complex pluralization and lazy-loading of locale files, this skill ensures your localized application remains performant, maintainable, and consistent with enterprise-grade standards.

主な機能

01Advanced pluralization rules and named interpolation patterns

02Localized date and number formatting via 'i18n-d' and 'i18n-n' components

030 GitHub stars

04Composition API integration with mandatory 'legacy: false' mode

05Component-based rich text interpolation with 'i18n-t'

06Type-safe translation key implementation using TypeScript

ユースケース

01Scaling enterprise SaaS dashboards across multiple languages with lazy-loaded translation bundles

02Building accessible web applications with rich-text translations using Vue components

03Developing multi-region e-commerce platforms with localized currency and date formatting

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add agents-inc/skills web-i18n-vue-i18n

For use in Claude.ai and ChatGPT

Download Skill