為什麼 Vue 本地化讓人頭痛
複製貼上噩夢
手動建立 de.json、fr.json、es.json。一次打字錯誤 = 應用程式崩潰。
昂貴的服務
Lokalise 每月 120 美元。Crowdin 每月 100 美元。對於一個副專案?
@:linked 引用損壞
Google Translate 會破壞 @:message.key 與 {named} 佔位符。
工作原理
3 步驟。2 分鐘。完成。
1
上傳 JSON
上傳你的 en.json 或 locales/en.json
2
選擇語言
有 29 種可用語言。德語、法語、日語…
3
下載
為你的 /locales 目錄取得 de.json、fr.json、es.json。
與 Vue i18n 生態系統相容
vue-i18n
Vue 2 與 Vue 3
@nuxtjs/i18n
Nuxt 模組
@intlify/nuxt3
Nuxt 3
petite-vue-i18n
輕量級
之前 → 之後
@:linked 參考, {name} 佔位符與複數形式將保持不變
之前 (locales/en.json)
// locales/en.json
{
"message": {
"hello": "Hello {name}!",
"linked": "@:message.hello World",
"count": "{n} item | {n} items"
},
"nav": {
"home": "Home",
"about": "About Us"
}
}之後 (locales/de.json)
// locales/de.json
{
"message": {
"hello": "Hallo {name}!",
"linked": "@:message.hello Welt",
"count": "{n} Artikel | {n} Artikel"
},
"nav": {
"home": "Startseite",
"about": "Über uns"
}
}為 Vue 開發者打造
佔位符保護
保護 {name}、@:linked、$t() 引用。您的應用程式仍將正常運作。
Vue 2 + Vue 3 + Nuxt 3
支援所有 vue-i18n 版本。JSON 結構保持原樣。
2 分鐘,而不是 2 小時
上傳 → 選擇語言 → 下載。在 npm install 之前完成。
翻譯記憶 = 90% 的節省
已翻譯的字串將被重複使用。更新幾乎不花費。
對 Vue i18n 的完整支援
佔位符 {named}
@:已連結的訊息
管道式複數化(|)
$t() 和 $tc() 引用
巢狀的訊息結構
數字格式化
日期/時間格式化
修飾符 (@.upper, @.lower)
為什麼不使用 Lokalise/Crowdin?
| shipglobal | Lokalise | Crowdin | |
|---|---|---|---|
| 價格 | €0,05/1k 字元 | $120/月+ | $100/月+ |
| @:已保護的連結 | |||
| 設定時間 | 2 分鐘 | 1+ 小時 | 1+ 小時 |
| 需要訂閱嗎? |