Package Exports

@tuhama/translation-manager
@tuhama/translation-manager/src/server.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@tuhama/translation-manager) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Translation Manager UI 🌍

A modern, web-based interface for managing i18n translation files in React and other JavaScript projects.

Features

Modern UI: Dark mode, glassmorphism, and smooth animations.
Auto-Translation: Integrated Google Translate support for single-key and bulk translations.
Missing Keys Detection: Identifies translation keys used in source code but missing from files.
Cleanup Tool: Detects and batch-removes unused translation keys.
Normalization: Synchronizes keys across all languages and sorts them alphabetically with one click.
Nested Keys: Supports dot-notation for nested JSON structures.
Tree View: Easy navigation and management of translation keys.
Zero Config: Auto-detects common locales folders.

Installation

Add it as a devDependency to your project:

npm install -g @tuhama/translation-manager

Or run directly with npx:

npx @tuhama/translation-manager

Usage

⚠️ Missing Keys Detection

The application automatically scans your source code for translation keys used (e.g., t('key.name')) but missing from your translation files. Click the "Missing" button in the sidebar to review and create them instantly.

🧹 Cleaning Unused Keys

Over time, some translation keys might become obsolete. Use the "Clean" button to identify and batch-delete keys that are no longer referenced in your source code.

🪄 Auto-Translation

Configure Google Cloud Translation API in the settings to enable auto-translation. Use the "Source-to-All" button in the editor to quickly populate all languages from a single source translation.

Recommended Setup:

Install Google Cloud CLI: gcloud auth application-default login
Add your Google Cloud Project ID in Settings
Start translating!

🪄 Normalization

To keep your translation files organized, use the "Normalize" button to synchronize keys across all files and sort them alphabetically.

Configuration

You can optionally create a translation.config.json in your project root:

{
  "path": "src/locales",
  "googleTranslate": {
    "projectId": "your-google-cloud-project-id"
  }
}

Authentication Options:

Recommended: Use Google Cloud CLI (gcloud auth application-default login)
Alternative: Specify keyFilename path to service account JSON file
Environment: Set GOOGLE_APPLICATION_CREDENTIALS environment variable

Development

To work on this repo:

npm install
cd web && npm install
npm run dev (starts both the API and the Vite UI)

Limitations

Dynamic Keys: The scanner uses regex to find translation keys. Highly dynamic keys (e.g. t(someVar + '.key') or t(dynamicValue)) may not be detected by the "Missing Keys" or "Unused Keys" tools.
Namespaces: Currently optimized for single-namespace or default-namespace projects.

@tuhama/translation-manager