WL Translation Engine

Your i18n bestie for Vue projects. Auto-translate with dynamic language support.

Features

Autocomplete for $t() keys

Type $t(' and get instant suggestions from all your translation files.

Hover Preview

Hover any translation key to see all languages at once. No more file jumping.

Quick Add Missing Keys

Missing a key? Select text, press Cmd+. / Ctrl+., and add translations to all language files instantly.

Dynamic Language Detection

The extension automatically detects languages from your JSON files. Add a new language file and it's instantly recognized!

Command Palette

Installation

From VS Code

1. Open VS Code
2. Press Cmd+P / Ctrl+P
3. Type ext install RithyTep.kirby-i18n
4. Press Enter

From Marketplace

Install from VS Code Marketplace

Requirements

• VS Code 1.85+
• Vue/TypeScript/JavaScript project with language JSON files

Configuration

Add to your .vscode/settings.json:

{
  // Path to language files (relative to workspace)
  "kirby-i18n.langPath": "src/lang",

  // Source language for translations (default: "en")
  "kirby-i18n.sourceLanguage": "en",

  // Custom language definitions for unknown codes
  "kirby-i18n.customLanguages": {
    "fr": {
      "name": "French",
      "flag": "🇫🇷",
      "apiCode": "fr-FR"
    },
    "de": {
      "name": "German",
      "flag": "🇩🇪",
      "apiCode": "de-DE"
    }
  }
}

Settings

Supported Languages (100+ Built-in)

The extension includes 100+ languages with proper names and flag emojis:

Popular Languages:

• 🇺🇸 English (en) • 🇨🇳 Chinese Simplified (zh_CN) • 🇹🇼 Chinese Traditional (zh_TW)
• 🇯🇵 Japanese (ja_JP) • 🇰🇷 Korean (ko_KR) • 🇹🇭 Thai (th_TH) • 🇻🇳 Vietnamese (vi_VN)
• 🇫🇷 French (fr, fr_FR) • 🇩🇪 German (de, de_DE) • 🇪🇸 Spanish (es, es_ES)
• 🇮🇹 Italian (it, it_IT) • 🇵🇹 Portuguese (pt, pt_BR) • 🇷🇺 Russian (ru_RU)
• 🇳🇱 Dutch (nl) • 🇵🇱 Polish (pl) • 🇺🇦 Ukrainian (uk) • 🇹🇷 Turkish (tr)
• 🇸🇦 Arabic (ar) • 🇮🇱 Hebrew (he) • 🇮🇷 Persian (fa) • 🇮🇳 Hindi (hi)

Regional Languages:

• Southeast Asia: 🇮🇩 Indonesian, 🇲🇾 Malay, 🇵🇭 Filipino, 🇰🇭 Khmer, 🇱🇦 Lao, 🇲🇲 Myanmar
• South Asia: 🇧🇩 Bengali, 🇮🇳 Tamil, Telugu, Marathi, Gujarati, 🇳🇵 Nepali, 🇱🇰 Sinhala
• Europe: 🇸🇪 Swedish, 🇩🇰 Danish, 🇳🇴 Norwegian, 🇫🇮 Finnish, 🇨🇿 Czech, 🇭🇺 Hungarian, 🇷🇴 Romanian, 🇬🇷 Greek
• Africa: 🇰🇪 Swahili, 🇿🇦 Afrikaans, 🇪🇹 Amharic

Note: Unknown language codes display as 🌐 CODE. Use customLanguages setting to add custom names and flags.

How It Works

1. Extension auto-detects *.json files in your language directory
2. Watches for changes and updates in real-time
3. Uses MyMemory API for auto-translation
4. Supports any number of languages (100+ built-in!)

What's New in v1.0.7

• 100+ built-in languages - Proper names and flag emojis for most common languages
• Dynamic language detection - Auto-detects from JSON files
• Configurable source language - Not limited to English
• Custom language definitions - Add any language with custom flags
• Workspace settings - Configure per project in .vscode/settings.json

Contributing

Contributions are welcome! Please open an issue or submit a PR.

License

MIT © RithyTep

If this extension helps you, please consider:

• Giving it a ⭐ on GitHub
• Leaving a review on the Marketplace