项目地址https://github.com/goblin-pitcher/i18n-collector老项目引入i18n国际化后，需要全部使用$t('Chinese')方法项目中的中文包，不同的对象有不同的包裹方式：在vue模板中，直接将$t('Chinese')包裹成中文即可。vue组件代码中，由于$t是全局导入的，所以需要包装成this.$t('Chinese')对于纯js部分，需要导入i18n模块，对于中文包i18n.t('Chinese')对于带数字的字符串，比如[一共${count}条数据]，需要转为$t('一共count条数据',{count:100})结构，转换前的代码在不同的地方可能会有不同的表现，比如在Vue的模板中，转换前的入口可能是这样的：[Total{{count}}Piecesofdata】问题分析面对这样的问题，首先想到的是把代码转成ast树，处理里面的中文字符串，再转成代码，但是实际遇到的问题如下：一般解析器（比如@bable/parser）可以只能处理js或jsx文件，不能处理vue模板。使用vue-loader将.vue文件转换为.js文件。虽然可以用@bable/parser来解析，但是可以转成.js文件后面的代码，没有相关的转换器可以转成.vue代码，不能满足我们的需求，即使有parserfor.vue文件（如vue-eslint-parser），没有对应的遍历和生成器工具，解析后的AST无法逆向转化为代码即使有.vue文件的解析器、遍历和生成器支持工具，重新生成的vue代码格式大概率无法满足eslint校验，需要自动纠错格式。问题分析，目前面临两个问题：需要有.vue文件支持解析生成工具，解决转换后代码的eslint格式问题。问题2生成处理后的.vue文件时可以在项目中运行eslint--fix命令实现。如果项目没有验证格式，自然不会安装eslint，但是如果验证了格式，则必须安装eslint，即执行eslint--fix命令即可。目前主要矛盾是问题1，观察问题1，.vue文件中的js文件有配套的转换工具，主要矛盾集中在模板上，虽然目前没有模板生成工具，但是可以看成是htmlparsing,template功能的解析是作为html解析器的插件完成的。使用npmigit+https://github.com/goblin-pitcher/i18n-collector.git-D-------------------------------npxi18n-collect参数参数名称缩写说明默认值dird需要国际化的目录./ignorediri需要忽略的文件或文件夹如-icar.js会忽略所有car开头的文件.js不管是否传这个参数，最后的文件会忽略i18n文件夹fixf运行collect后是否自动执行eslint--fix，默认开启，--fixfalse表示关闭eslint并执行true配置新建一个i18n-collect.config.js文件，具体配置中可以传入，默认配置如下：constdefConfig={//转换当前目录下的文件dir:'./',//忽略项ignoredir:[],//是否执行eslint--fixfix:true,//收集中文词条的文件名output:'zh-CN.js',//文件处理ssing配置文件:{//模板中用中文包裹的函数名，如$t('Chinese')template:{prefix:"$t"},//用于处理纯js文件js:{//如果有中文条目需要解压，需要先导入i18n相关包进行打包。这个配置是添加导入文件的配置//默认导入时Addimport{i18n}from'@/utils/i18n.utils'addImport:{from:"@/utils/i18n.utils",data:["i18n",},//包裹中文条目的方法，如i18n.t('Chinese')prefix:"i18n.t",},//脚本在.vue文件中包裹中文的方法，如this.$t('Chinese')//遇到sparePrefix配置，i18n。t('Chinese')的字段也将用作包装转换方法而不是再次包装this.$tvue:{prefix:"this.$t",sparePrefix:'i18n.t'}}};
