使用 vue-i18n 的时候 需要进行繁琐的替换
如:
<div>XXX yyy ZzZ</div>
替换为:
<div>{
{$t("xxx_yyy_zzz")}}</div>
然后在 js 文件中增加条目
xxx_yyy_zzz: "XXX yyy ZzZ",
查找 tag 里面的文本也很繁琐
使用 WebStorm 和 IDEA 等 IDE 配合正则表达式可以很快的完成这个操作
全局替换
使用方法
类似(?<=>)(\w+)(?=<) 的正则表达式, 可以匹配到标签中的文本
如:
<div>XXX yyy ZzZ</div> 中的 XXX yyy ZzZ
参考 https://blog.csdn.net/MAIMIHO/article/details/109024705 中的正则替换
XXX yyy ZzZ 会被替换为 {
{$t("xxx_yyy_zzz")}}xxx_yyy_zzz: "XXX yyy ZzZ",
这样将前面一部分直接通过替换完成, 后面一部分复制到 js 文件中就可以了
正则表达式示例
// 匹配 <div>XXX</div>
(?<=>)(\w+)(?=<)
{
{\$t("\L$1")}}\L$1: "\E$1",
// 匹配 <div>XXX yyy</div>
(?<=>)(\w+) (\w+)(?=<)
{
{\$t("\L$1_\L$2")}}\L$1_\L$2: "\E$1 \E$2",
// 匹配 <div>XXX yyy ZzZ</div>
(?<=>)(\w+) (\w+) (\w+)(?=<)
{
{\$t("\L$1_\L$2_\L$3")}}\L$1_\L$2_\L$3: "\E$1 \E$2 \E$3",
// 匹配剩下的
(?<=">)[^{\n](.*)[^}](?=</)
(?<=>)(\s*\w[\w\s]*[^}])(?=<)