[chrome扩展开发] i18n国际化

1. 常规配置

通常，只有超过一种语言以上，才需要国际化。加入现在需要中文（zh_CN）和英文（en）

1. manifest.json 配置中需要添加 "default_locale": "en",来配置默认语言
2. 添加_locales 目录，里面按照语言的缩写来创建文件夹。
   
3. 文件夹中添加文件 messages.json 里面放翻译

2. 应用翻译

1. 需要翻译的内容在 manifest.json 中

首先在messages.json中配置需要翻译的变量appDesc

{
    "appDesc": { "message": "这里是翻译内容" },
｝

在配置文件中使用

#manifest.json
{
    ...
    "default_locale": "en",
    "description": "__MSG_appDesc__",
    ...
}

2. 需要翻译的内容在 js 中

首先在messages.json中配置需要翻译的变量appDesc

{
    "appDesc": { "message": "这里是翻译内容" },
｝

在中使用

let msg = chrome.i18n.getMessage('appDesc')

另外，getMessage函数是支持第二个参数的，第二个参数是一个数组。
是的翻译可以使用模版。

示例：
翻译文件定义了一个instrP1，里面包含一个placeholders,
"content": "$1",表示第二个参数数组中的第一个元素来替换$name$.

{
"instrP1": {
        "message": "用户在接受$name$服务之前，请务必仔细阅读声明并同意",
        "placeholders": {
            "name": {
                "content": "$1",
                "example": "WebInfo"
            }
        }
    },
}

代码中

let name = "safecode.cc";
let instrP1 = chrome.i18n.getMessage('instrP1', [name]);

3 vue 中使用

这个就很方便了

<script>
export default {
 data() {
   return {
       i18n: {
           instructions: "说明",
           thanks: "感谢",
           talk: "吐槽", 
       }
   }
 },
 created() {
     for(let x in this.i18n) {
       let v = chrome.i18n.getMessage(x);
       if (v) {
         this.i18n[x] = v;
       } else {
         console.log(`${x} 没有翻译`)
       }
     }
 }
}
</script>