多语言方案之硬编码变量替换

前景

为了扩宽海外市场，不少公司要求项目要求支持多语言切换，多语言专项中一个需要解决的问题是：js文件中的硬编码需要用变量替换

举个例子

例如需要替换widget.js中的硬编码部分，替换前的文件中硬编码用红色框框圈中

替换后的文件用变量替换效果如下图

再将变量对应的值写到一个文件里面进行维护，这个文件一般会有多份，每个语种一份：

代码实现

/**
 * 多语言处理
 * 1、将组件中的中文抽取出来，用变量替换，如'中文',用msg1替换
 * 2、然后将变量msg1 = '中文'写入另外一个文件
 */
const fs = require('fs');
const regex = /\'([^\']*?)[\u4e00-\u9fa5]+\'/g;
const obj = {};
fs.readFile('./widget.js', { encoding: 'utf8' }, function (err, data) {
    var matches = data.match(regex);
    let newContent = data;
    let i18nStr = '';
    if(matches && matches.length>0){
        matches.forEach((item,index)=>{
            let key = 'msg'+index;
            obj[key] = item;
            newContent = newContent.replace(item,key);
            i18nStr += key+':'+item+';\r\n';
        });
    }
    //修改widget.js文件
    if(!i18nStr){
        return;
    }
    fs.writeFile('./widget.js', newContent, 'utf8', (err) => {
        if (err) throw err;        
    });
    //将变量写到widget_i18n.js中集中管理
    fs.writeFile('./widget_i18n.js', i18nStr, 'utf8', (err) => {
        if (err) throw err;        
    });
});