Skip to main content

Translation File Sync: Panatilihing Naka-sync ang mga i18n Key sa Iba’t Ibang Locale

Sa tuwing may developer na nagdaragdag ng key sa source locale, nawawala sa sync ang 15 pang locale file. Nagpapakita ang missing keys ng mga raw path sa mga user. Nagsasayang ang stale keys ng oras ng mga translator at nagpapalaki ng bundle size. Pinapanatiling naka-align ang lahat ng ito ng automated sync.

1

Ang Problema sa Pag-sync

Palaging nagkakahiwa-hiwalay ang mga translation file. May developer na nagdagdag ng 'settings.notifications.title' sa en.json pero nakalimutang idagdag ito sa iba pang 15 locale file. May isa pang developer na nag-alis ng 'onboarding.welcome' sa code pero iniwan ito sa lahat ng locale file. May ikatlong developer na pinalitan ang 'user.name' ng 'user.displayName' sa English pero hindi sa iba pang locale. Sa paglipas ng mga buwan, nagdi-diverge ang inyong mga locale file: may mga key na nawawala, lipas, o hindi magkatugma sa iba’t ibang locale.

The drift problem
// The problem: translation files drift out of sync

// Developer adds a new feature with new keys:
// en.json (source of truth)
{
  "nav.home": "Home",
  "nav.about": "About",
  "nav.pricing": "Pricing",     // NEW
  "nav.changelog": "Changelog"  // NEW
}

// de.json (out of sync - missing new keys)
{
  "nav.home": "Startseite",
  "nav.about": "Über uns"
  // nav.pricing - MISSING
  // nav.changelog - MISSING
}

// de.json also has stale keys from deleted features:
{
  "nav.home": "Startseite",
  "nav.about": "Über uns",
  "nav.legacy_page": "Alte Seite"  // STALE - removed from en.json
}
Mas masama ang nawawalang key kaysa nawawalang translation. Ang nawawalang translation ay puwedeng mag-fallback sa source language. Ang nawawalang key ay nagdudulot ng runtime error, nagpapakita ng raw key path sa user, o nagre-render ng walang laman na string. Dapat ipatupad ang sync, hindi lang inaasahan.
2

Pagtukoy sa mga Nawawalang Key

Ang missing key ay key na nasa source locale pero wala sa target locale. Ito ang pinakakaraniwang isyu sa sync at siya ring pinaka-nakakasira—nakikita ng user ang raw key path tulad ng 'settings.notifications.title' sa halip na isinaling teksto. Tinutukoy ng i18n-validate ang mga missing key sa pamamagitan ng pagdi-diff ng key structure ng bawat locale laban sa source.

Terminal
# Detect missing and stale keys
npx i18n-validate sync \
  --source locales/en.json \
  --targets 'locales/*.json'

# Output:
# locales/de.json:
#   Missing keys (2):
#     - nav.pricing
#     - nav.changelog
#   Stale keys (1):
#     - nav.legacy_page
#   Coverage: 66.7% (2/3 keys)
#
# locales/ja.json:
#   Missing keys (5):
#     - nav.pricing
#     - nav.changelog
#     - settings.theme
#     - settings.language
#     - settings.notifications
#   Coverage: 50.0% (5/10 keys)
Patakbuhin ang i18n-validate gamit ang --check missing-keys flag para tumuon mismo sa mga isyu sa sync. Gamitin ang --severity error para bumagsak ang CI kapag may missing key, at matiyak na naaayos ang mga ito bago mag-merge.
3

Pagtukoy sa mga Lipas na Key

Ang stale key ay key na nasa mga translation file pero hindi na nire-reference sa code. Nagsasayang ang mga stale key ng oras ng mga translator (isinasalin nila ang mga string na walang nakakakita), nagpapalaki ng bundle size, at nagdudulot ng kalituhan sa maintenance. Para matukoy ang mga stale key, kailangan ang pag-cross-reference ng mga locale file laban sa mga reference sa code.

Terminal
# Step 1: Check which files are out of sync
npx i18n-validate sync --source locales/en.json --targets 'locales/*.json'

# Step 2: Auto-fill missing keys with source values (as placeholders)
npx i18n-validate sync \
  --source locales/en.json \
  --targets 'locales/*.json' \
  --fill-missing \
  --fill-value "[NEEDS TRANSLATION] {{source}}"

# Step 3: Remove stale keys no longer in source
npx i18n-validate sync \
  --source locales/en.json \
  --targets 'locales/*.json' \
  --remove-stale

# Step 4: Sort keys to match source order (cleaner diffs)
npx i18n-validate sync \
  --source locales/en.json \
  --targets 'locales/*.json' \
  --sort-keys

# All at once:
npx i18n-validate sync \
  --source locales/en.json \
  --targets 'locales/*.json' \
  --fill-missing \
  --remove-stale \
  --sort-keys
4

Pag-automate ng Sync

Pinakamabisa ang sync strategy na pinagsasama ang tatlong layer: 1) Pre-commit hook na nagva-validate ng sync sa bawat commit. 2) CI pipeline check na humaharang sa mga merge na may isyu sa sync. 3) Pana-panahong full audit na humuhuli sa drift na naiipon mula sa hotfix at manual edit.

.husky/pre-commit
# .husky/pre-commit
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

# Check if source locale file changed
SOURCE_CHANGED=$(git diff --cached --name-only | grep -c 'locales/en.json')

if [ "$SOURCE_CHANGED" -gt 0 ]; then
  echo "Source locale changed - checking sync..."

  npx i18n-validate sync \
    --source locales/en.json \
    --targets 'locales/*.json' \
    --fail-on-missing \
    --min-coverage 90

  if [ $? -ne 0 ]; then
    echo ""
    echo "Translation files are out of sync!"
    echo "Run: npx i18n-validate sync --fill-missing"
    exit 1
  fi
fi
.github/workflows/i18n-sync.yml
# .github/workflows/i18n-sync.yml
name: Translation Sync Check

on:
  pull_request:
    paths:
      - 'locales/**'

jobs:
  sync-check:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Check translation sync
        run: npx i18n-validate sync \
          --source locales/en.json \
          --targets 'locales/*.json' \
          --fail-on-missing \
          --min-coverage 95

      - name: Comment on PR if out of sync
        if: failure()
        uses: actions/github-script@v7
        with:
          script: |
            github.rest.issues.createComment({
              issue_number: context.issue.number,
              owner: context.repo.owner,
              repo: context.repo.repo,
              body: 'Translation files are out of sync. Please run npx i18n-validate sync --fill-missing and commit.'
            })
5

Pag-uulat ng Translation Coverage

Ang translation coverage ay porsyento ng mga source key na may translation sa bawat target locale. Gumagawa ang i18n-validate ng coverage report na nagpapakita ng porsyento kada locale at binibigyang-diin ang mga locale na nahuhuli. Gumamit ng coverage threshold sa CI para harangin ang mga merge kapag bumaba ang coverage sa mas mababa sa katanggap-tanggap na antas.

Namespace-based sync
// Split large translation files by feature/namespace
// locales/
// ├── en/
// │   ├── common.json      (nav, footer, errors)
// │   ├── auth.json         (login, register, reset)
// │   ├── dashboard.json    (dashboard-specific)
// │   └── settings.json     (settings page)
// ├── de/
// │   ├── common.json
// │   ├── auth.json
// │   ├── dashboard.json
// │   └── settings.json

// Sync with namespace support:
npx i18n-validate sync \
  --source 'locales/en/*.json' \
  --targets 'locales/*/%.json' \
  --namespace-pattern '{locale}/{namespace}.json'

// Benefits:
// - Smaller files, easier to review
// - Feature teams own their translations
// - Lazy-load only needed namespaces
// - Parallel translation workflows
Magtakda ng magkakaibang coverage threshold para sa iba’t ibang locale. Maaaring mangailangan ang inyong primary locale (de, fr, ja) ng 100% coverage, habang ang mga bagong idinagdag na locale (th, vi) ay puwedeng magsimula sa 80% at unti-unting itaas habang natatapos ang mga translation.

Subukan ang i18n Agent Ngayon

I-drop dito ang inyong translation file

JSON, YAML, PO, XML, CSV, Markdown, Properties

o i-click para mag-browse

Mga target language

Hindi kailangan ang signupInstant na estimate

FAQ sa Translation File Sync