flutter 多语言脚本实现

286 阅读3分钟

目录

本篇文章主要是介绍一下自己写的一个小工具,用来flutter国际化多语言excel转json.

流程介绍

  • 1.下载excel到本地,该步骤需手动执行(如果本地文档可忽略)
  • 2.读取excel数据,按顺序以key-v1-v2-v3-v4...等格式写成json文件
  • 3.通过脚本插件运行get_cli的指令生成生成对应map
  • 4.执行结束

问题讨论

1.为什么用云文档,而不用本地excel

excel放本地文档,会产生冲突,在多人协作的时候,有可能会出现覆盖掉他人的修改多语言修改情况,这个会增加沟通成本.线上云文档则不会有这个问题,云文档是实时修改的,可以保证本地不管是如何修改,多语言都不会有冲突问题.不过这东西也是见仁见智,如果多语言是单人维护的话,直接用本地文档也可以.毕竟本地文档修改起来方便.

2.为什么使用get_cli

这个主要是因为同事喜欢属性点语法来写多语言才使用的,我个人对是否生成属性文件并不在意(大概是我经历过Swift中的R.swift脚本文件过大卡死项目的痛吧),我个人是比较喜欢去复制字符串key来写的,只要不是手动拼写,我觉得肯定是不会出错的,所以这个也是见仁见智,大家看喜好选择,毕竟Map<String, Map<String, String>>? translationsKeys需要的只是key:map.

流程梳理

  • 1.使用excel插件读取文件,转excel,获取table1
    import 'package:excel/excel.dart';
    
    final file = File(excelFile);
    final bytes = file.readAsBytesSync();
    final excel = Excel.decodeBytes(bytes);
    final table = excel.tables[excel.tables.keys.first];
    
  • 2.key-map写入json文件
    void _writeToJSON(Sheet table, int columnIndex, String targetPath) {
      // final data = <String, dynamic>{};
      final SplayTreeMap<String, dynamic> data = SplayTreeMap<String, dynamic>();
    
      for (var i = 1; i < table.maxRows; i++) {
        final key = table
            .cell(CellIndex.indexByColumnRow(columnIndex: 0, rowIndex: i))
            .value
            .toString();
        data[key] = table
            .cell(CellIndex.indexByColumnRow(columnIndex: columnIndex, rowIndex: i))
            .value
            .toString();
      }
    
      // final jsonContent = jsonEncode(data);
      // File(targetPath).writeAsStringSync(jsonContent);
      final jsonContent = jsonEncode(data);
      final formattedJson =
          const JsonEncoder.withIndent('  ').convert(jsonDecode(jsonContent));
      File(targetPath).writeAsStringSync(formattedJson);
    }
    
  • 3.执行get-cli脚本
    print(r'执行脚本开始, 前置需安装get_cli 并配置环境变量 export PATH="$HOME/.pub-cache/bin:$PATH"');
    print(Directory.current.path);
    
    final shell = Shell();
    final res = await shell.run('''
    get generate locales assets/locales
    ''');
    // final res = await Process.run('get', ['generate', 'locales', 'assets/locales'], workingDirectory: Directory.current.path, runInShell: true);
    print('$res');
    print('执行脚本结束');
    

执行测试

这里我顺便在readme里写了一个shell,到时候可以直接执行readme的shell的脚本即可. image.png

顺便再说一点, Directory.current.path获取的是当前执行dart文件时的文件对象路径(说白了就是在什么路径下执行,获取的就是啥),并不是dart文件所在的文件路径.

excel格式展示

image.png

脚本执行结果

image.png

生成json位置

image.png image.png

生成get-cli脚本位置

image.png image.png

总结

这只是一个简单的多语言脚本,做海外项目少不了多语言功能,单独手动去维护多个json文件更是一件劳心劳力的事情,所以基本上所有人都会去寻求一个脚本来维护执行多语言功能.