資訊專欄INFORMATION COLUMN
摘要：在寫一個的過程中難免會遇到要做國際化的時候也就是需要根據不同的地區展示不同的文案對于簡單的文本直接用一個或者或者一個變量就能搞定但是有時候需要在一句話中加入變量就比較麻煩或者說比較惡心了比如這樣的情況有個人喜歡了你應運而生其作用是將模板
在寫一個APP的過程中, 難免會遇到要做國際化的時候. 也就是需要根據不同的地區, 展示不同的文案. 對于簡單的文本, 直接用一個xml或者json或者一個變量就能搞定, 但是有時候需要在一句話中加入變量, 就比較麻煩或者說比較惡心了. 比如這樣的情況:
cn: 有xx個人喜歡了你. en: xx People liked you.
i18n-json-compiler應運而生, 其作用是將json模板編譯成TypeScript(或者JavaScript)函數或者字符串.
比如對以下json:
[
{ "cn": "你好", "en": "Hello" },
{ "cn": "{n}個好友", "en": "{n} friends" },
]
可以直接編譯出ts文件, 內容大致如下:
export const cn = {
Hello: "你好",
n_friends: (n: any) => n + "個好友",
}
export const en = {
Hello: "Hello",
n_friends: (n: any) => n + " friends",
}
在代碼中直接調用相應的屬性或函數即可.
安裝yarn add i18n-json-compiler # 或者使用npm/cnpm npm i -S i18n-json-compiler使用
在命令行中, 執行./node_modules/.bin/i18n, 參數如下:
i18n [options] - Parse i18n json files to typescript files. Options: -i, --input-files The json files to parse [string] [required] -o, --output-dir The directory to emit output [string] [required] -h, --help Show help [boolean] -v, --version Show version number [boolean] --default-lang [string] [default: "cn"]JSON文檔的格式
i18n命令接受參數-i指定輸入文件列表(glob), 比如./strings/*.json, 文件格式為json, 內容為一個數組. 每個數組元素為一組需要編譯的字符串. key為語言, value為值. 值中被{}包起來的地方會被轉換為函數參數, 其格式為{name:type:default}, 其中:
name是必需的, 可以是字符串或數字
type為數據類型, 可以是int, double, string, boolean, any, 默認為any, 即接受任意參數
default為參數默認值
比如:
[
{
"cn": "{n:int:1}個人喜歡了你",
"en": "{n}people liked you"
}
]
得出的結果為:
const n_people_liked_you = (n: int = 1) => n + "個人喜歡了你"輸出格式
i18n接受參數-o指定輸出目錄, 輸入目錄中, 包括一個index.ts文件, 以及若干語言文件夾, 其中index.ts為所用到的文件, 其導出一個變量strings, 結構如下:
