Node-RED组件开发中的国际化(i18n)开发实用技巧

[Valdanitooooo]

目录结构

当开发一个名为 formatter 组件时，目录结构是这样的

├── README.md
├── formatter.html
├── formatter.js
├── icons
│   └── G.svg
├── locales
│   ├── en-US
│   │   ├── formatter.html  # 英文帮助页
│   │   └── formatter.json # 英文json
│   └── zh-CN
│       ├── formatter.html # 中文帮助页
│       └── formatter.json # 中文json
├── package-lock.json
└── package.json

组件开发细节

• 命名

首先命名规则要保持一致, 如果node叫formatter, 那它的帮助页和多语言json都要叫formatter

• node-red html

正常这样引用就行 <span data-i18n="label.name">

• 右侧帮助页

直接在locales/xxx/目录中加html

• 注册名

统一用英文, 只要定义了paletteLabel和label, 显示名称自然就国际化了

• 左侧palette中的名称

 paletteLabel: function(){
     return this.name || RED._("node-red-contrib-****-formatter/formatter:label.name");
}

• 中间编辑画布中的名称

label: function () {
    return this.name || RED._("node-red-contrib-****-formatter/formatter:label.name");
}

涉及core模块的国际化

1. 首先要确定settings.js中coreNodesDir的配置要正确, 引用的是项目中的的core，而不是官方依赖的core
2. core模块很多内容都有中文翻译的，但是大多数都没有paletteLabel，paletteLabel就是左侧那个面板，那里切换到中文后，显示的还是英文，所以在它的html中的注册方法中加上paletteLabel的方法实现即可
3. core模块category的国际化特别一些，用this取不到，还是需要用RED加包名取到

参考资料

• https://github.com/node-red/node-red/wiki/Design:-i18n#internationalization