vue中自定义设置多语言,并且运行js脚本自动生成多语言文件

news2024/10/5 13:08:30

在项目中需要进行多个国家语言的切换时,可以用到下面方法其中一个

一、自定义设置多语言

方法一:

可以自己编写一个设置多语言文件

在项目新建js文件,命名为:language.js,代码如下

// language.js 文档
let languagePage = {
  CN: {
    frame_rules: "规则",
    frame_remark: "虚位拟待",
  },
  EN: {
    frame_rules: "Rules",
    frame_remark: "Vacant position",
  },
  IN: {
    frame_rules: "Aturan",
    frame_remark: "Posisi Kosong",
  },
  VI: {
    frame_rules: "Quy tắc",
    frame_remark: "Vị trí Trống",
  },
  MS: {
    frame_rules: "Peraturan",
    frame_remark: "Jawatan Kosong",
  },
  TH: {
    frame_rules: "กฎ",
    frame_remark: "ตำแหน่งว่าง",
  },
  HI: {
    frame_rules: "กฎ",
    frame_remark: "खाली पद",
  },
};
export const getLangue = () => {
  // 获取我们设置存放在浏览器的localStorage 的语言类型
  let { language } =
    JSON.parse(window.localStorage.getItem("userInfo")) || {};
  // if (language == "ar") {
  //   // 阿拉伯语 展示顺序会相反,设置反向,使语言展示正常
  //   document.documentElement.setAttribute("dir", "rtl");
  //   // document.getElementById("app") &&
  //   //   document.getElementById("app").classList.add("ar");
  // }

  // zh  中文
  // en 英文
  // in  印尼
  // vi  越南
  // ms 马拉西亚
  // th  泰语
  // hi  印度语
  // ar 阿拉伯语

  let list = {
    in: "IN",
    id: "IN",
    zh: "CN",
    ms: "MS",
    vi: "VI",
    th: "TH",
    hi: "HI",
  };
  //假设能读取到浏览器设置的语言,就使用该语言 ,假设没有设置到浏览器任何语言类型,就默认使用英文
  if (list[language]) return languagePage[list[language]];
  return languagePage.EN;
};

在组件中使用多语言:

<template>
  <div>
    <!-- 使用多语言 -->
    <div>{{ language.frame_rules }}</div>
  </div>
</template>
<script>
// 在需要的组件引入多语言文件
import { getLangue } from "@/utils/language.js";

export default {
  data() {
    return {
      language: getLangue(), //赋值多语言
    };
  },
  mounted() {},
  computed: {},
  methods: {},
};
</script>
<style lang="scss" scoped></style>

设置类型语言 :

你可以在app.vue的生命周期设置

//vue的生命周期mounted设置语言为中文
mounted() {
    const langType = JSON.stringify({ language: "zh" });
    window.localStorage.setItem("userInfo", langType);
},

当然,你可以写选择器,让用户选择对应的语言,然后强制刷新浏览器后便生效了

 const langType = JSON.stringify({ language: "zh" });
 window.localStorage.setItem("userInfo", langType);
 window.location.reload(); //设置完语言后 强制刷新浏览器才生效

方法二:使用使用vue-i18n 库,提示,下面展示是vue3中使用为例子

官方文档介绍:介绍 | Vue I18n

使用npm导入vue-i18n

npm i vue-i18n@next  --save

1、创建i18n所需文件夹(这里最好放置src下)

在src下建文件夹lang,在文件夹下新建文档 en.ts 和zh.ts 文档里面内容如下

en.ts文档:

// en.js文档

//键值命名一定要和zh.ts 一一对应 ,键值的写法可用双引号,例如:"OP_check",也可不用。例如:home

// 英文
const en = {
  "OP_check": "CHECK",
  home: "Home",
};
export default en;

zh.ts文档:

// zh.js文档

// 中文
const zh = {
  "OP_check": "查看",
  home: "主页",
};
export default zh;

2.在文件夹lang新建文档 命名 index.ts

index.ts文档:

import en from "./en"; // 英文
import zh from "./zh"; // 中文

//导出所有翻译内容
export default {
  en,
  zh,
};

3、在文件夹lang新建文档 命名 i18n.ts

i18n.ts文档

import { createApp } from "vue";
//这里注意引入的App.vue文件路径,确保文件成功被引进来
import App from "../App.vue";

import { createI18n } from "vue-i18n";
import messages from "./index";

const app = createApp(App);
const language = (navigator.language || "en").toLocaleLowerCase(); // 这是获取浏览器的语言

if (!localStorage.getItem("lang")) {
  localStorage.setItem("lang", "en"); //设置默认语言为英文
}

const i18n = createI18n({
  legacy: false, //处理报错Uncaught (in promise) SyntaxError: Not available in legacy mode (at message-compiler.esm-bundler.js:54:19)
  locale: localStorage.getItem("lang") || language.split("-")[0] || "en", //注意locale属性! 首先从缓存里拿,没有的话就用浏览器语言,
  fallbackLocale: "en", // 设置备用语言
  messages,
});

export default function (app: any) {
  app.use(i18n);
}

4、在vue的mian文件,全局注入多语言

主要代码如下;

import i18n from "@/lang/i18n"; //导入多语言

app.use(i18n); //全局注入多语言

5、在项目中使用多语言

在dom元素上直接使用vue-i18n如下

<template>
  <!-- 在 dom中使用vue-i18n-->
  <div>{{ $t("home") }}</div>
</template>

在<script>脚本中使用vue-i18n如下

<template>
  <!-- 在 dom中使用vue-i18n-->
  <div>{{ $t("home") }}</div>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n"; //引入vue-i18n
const { t } = useI18n(); // 使用多语言关键字 t ——> vue-i18内置关键字,不可改写名字
const title = ref(t("OP_check"));  //在js代码中使用vue-i18n 这里的title === "CHECK"
</script>
<style scoped lang="scss"></style>

6、使用vue-i18n设置语言

<template>
  <!-- 在 dom中使用vue-i18n-->
  <div>{{ $t("home") }}</div>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import { useI18n } from "vue-i18n"; //引入vue-i18n
const { locale } = useI18n(); // 使用多语言关键字 locale ——> vue-i18内置关键字,不可改写名字
const changLanguage = (e: any) => {
// 设置语言,其中locale是vue-i18内置设置语言的固定方法;改变locale的值就是改变语言类型了
  if (Number(e) === 1) {
    locale.value = "en";
    localStorage.setItem("lang", "en");
  } else {
    locale.value = "zh";
    localStorage.setItem("lang", "zh");
  }
  window.location.reload(); // 设置语言完成后,强制刷新浏览器,效果更换好
};
</script>
<style scoped lang="scss"></style>

上面设置多语言需要一个个复制粘贴进去,在开发工作的过程中很麻烦,是非常浪费时间的无脑操作,下面我们通过脚本,自动生成多语言文档,

二、运行js脚本自动生成多语言文件

1、在src同级目录下,新建目录命名 tools 

2.在tools 下新建文件夹 命名lang

3、在lang文件夹下,新建文档 命名:package-lock.json

package-lock.json文档代码如下

{
  "name": "app",
  "version": "1.0.0",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {
    "@babel/runtime": {
      "version": "7.24.7",
      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.7.tgz",
      "integrity": "sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==",
      "requires": {
        "regenerator-runtime": "^0.14.0"
      }
    },
    "adler-32": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.2.0.tgz",
      "integrity": "sha512-/vUqU/UY4MVeFsg+SsK6c+/05RZXIHZMGJA+PX5JyWI0ZRcBpupnRuPLU/NXXoFwMYCPCoxIfElM2eS+DUXCqQ==",
      "requires": {
        "exit-on-epipe": "~1.0.1",
        "printj": "~1.1.0"
      }
    },
    "babel-plugin-transform-remove-console": {
      "version": "6.9.4",
      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.9.4.tgz",
      "integrity": "sha512-88blrUrMX3SPiGkT1GnvVY8E/7A+k6oj3MNvUtTIxJflFzXTw1bHkuJ/y039ouhFMp2prRn5cQGzokViYi1dsg==",
      "dev": true
    },
    "buffer-from": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="
    },
    "cfb": {
      "version": "1.2.2",
      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
      "requires": {
        "adler-32": "~1.3.0",
        "crc-32": "~1.2.0"
      },
      "dependencies": {
        "adler-32": {
          "version": "1.3.1",
          "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
          "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A=="
        }
      }
    },
    "codepage": {
      "version": "1.15.0",
      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA=="
    },
    "crc-32": {
      "version": "1.2.2",
      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ=="
    },
    "exit-on-epipe": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/exit-on-epipe/-/exit-on-epipe-1.0.1.tgz",
      "integrity": "sha512-h2z5mrROTxce56S+pnvAV890uu7ls7f1kEvVGJbw1OlFH3/mlJ5bkXu0KRyW94v37zzHPiUd55iLn3DA7TjWpw=="
    },
    "frac": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
    },
    "minimist": {
      "version": "1.2.8",
      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="
    },
    "node-xlsx": {
      "version": "0.17.2",
      "resolved": "https://registry.npmjs.org/node-xlsx/-/node-xlsx-0.17.2.tgz",
      "integrity": "sha512-j92dGS8KvGPi6YpYovHrR9zWiyDONx7DiGhl1SjM+vzxAh3do6hmerFCyN+hRuK7QhwHdwzfpYxZm+hKA/uErA==",
      "requires": {
        "@babel/runtime": "^7.15.4",
        "buffer-from": "^1.1.2",
        "xlsx": "^0.17.2"
      }
    },
    "printj": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/printj/-/printj-1.1.2.tgz",
      "integrity": "sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ=="
    },
    "regenerator-runtime": {
      "version": "0.14.1",
      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
    },
    "ssf": {
      "version": "0.11.2",
      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
      "requires": {
        "frac": "~1.1.2"
      }
    },
    "wmf": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
    },
    "word": {
      "version": "0.3.0",
      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
    },
    "xlsx": {
      "version": "0.17.5",
      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.17.5.tgz",
      "integrity": "sha512-lXNU0TuYsvElzvtI6O7WIVb9Zar1XYw7Xb3VAx2wn8N/n0whBYrCnHMxtFyIiUU1Wjf09WzmLALDfBO5PqTb1g==",
      "requires": {
        "adler-32": "~1.2.0",
        "cfb": "^1.1.4",
        "codepage": "~1.15.0",
        "crc-32": "~1.2.0",
        "ssf": "~0.11.2",
        "wmf": "~1.0.1",
        "word": "~0.3.0"
      }
    }
  }
}

4、在lang文件夹下,新建文档 命名:package.json

package.json文档代码如下

{
  "name": "app",
  "version": "1.0.0",
  "lockfileVersion": 1,
  "requires": true,
  "dependencies": {
    "@babel/runtime": {
      "version": "7.24.7",
      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.7.tgz",
      "integrity": "sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==",
      "requires": {
        "regenerator-runtime": "^0.14.0"
      }
    },
    "adler-32": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.2.0.tgz",
      "integrity": "sha512-/vUqU/UY4MVeFsg+SsK6c+/05RZXIHZMGJA+PX5JyWI0ZRcBpupnRuPLU/NXXoFwMYCPCoxIfElM2eS+DUXCqQ==",
      "requires": {
        "exit-on-epipe": "~1.0.1",
        "printj": "~1.1.0"
      }
    },
    "babel-plugin-transform-remove-console": {
      "version": "6.9.4",
      "resolved": "https://registry.npmjs.org/babel-plugin-transform-remove-console/-/babel-plugin-transform-remove-console-6.9.4.tgz",
      "integrity": "sha512-88blrUrMX3SPiGkT1GnvVY8E/7A+k6oj3MNvUtTIxJflFzXTw1bHkuJ/y039ouhFMp2prRn5cQGzokViYi1dsg==",
      "dev": true
    },
    "buffer-from": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="
    },
    "cfb": {
      "version": "1.2.2",
      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.2.tgz",
      "integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
      "requires": {
        "adler-32": "~1.3.0",
        "crc-32": "~1.2.0"
      },
      "dependencies": {
        "adler-32": {
          "version": "1.3.1",
          "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.3.1.tgz",
          "integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A=="
        }
      }
    },
    "codepage": {
      "version": "1.15.0",
      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.15.0.tgz",
      "integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA=="
    },
    "crc-32": {
      "version": "1.2.2",
      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz",
      "integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ=="
    },
    "exit-on-epipe": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/exit-on-epipe/-/exit-on-epipe-1.0.1.tgz",
      "integrity": "sha512-h2z5mrROTxce56S+pnvAV890uu7ls7f1kEvVGJbw1OlFH3/mlJ5bkXu0KRyW94v37zzHPiUd55iLn3DA7TjWpw=="
    },
    "frac": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
    },
    "minimist": {
      "version": "1.2.8",
      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="
    },
    "node-xlsx": {
      "version": "0.17.2",
      "resolved": "https://registry.npmjs.org/node-xlsx/-/node-xlsx-0.17.2.tgz",
      "integrity": "sha512-j92dGS8KvGPi6YpYovHrR9zWiyDONx7DiGhl1SjM+vzxAh3do6hmerFCyN+hRuK7QhwHdwzfpYxZm+hKA/uErA==",
      "requires": {
        "@babel/runtime": "^7.15.4",
        "buffer-from": "^1.1.2",
        "xlsx": "^0.17.2"
      }
    },
    "printj": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/printj/-/printj-1.1.2.tgz",
      "integrity": "sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ=="
    },
    "regenerator-runtime": {
      "version": "0.14.1",
      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
    },
    "ssf": {
      "version": "0.11.2",
      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
      "requires": {
        "frac": "~1.1.2"
      }
    },
    "wmf": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
    },
    "word": {
      "version": "0.3.0",
      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
    },
    "xlsx": {
      "version": "0.17.5",
      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.17.5.tgz",
      "integrity": "sha512-lXNU0TuYsvElzvtI6O7WIVb9Zar1XYw7Xb3VAx2wn8N/n0whBYrCnHMxtFyIiUU1Wjf09WzmLALDfBO5PqTb1g==",
      "requires": {
        "adler-32": "~1.2.0",
        "cfb": "^1.1.4",
        "codepage": "~1.15.0",
        "crc-32": "~1.2.0",
        "ssf": "~0.11.2",
        "wmf": "~1.0.1",
        "word": "~0.3.0"
      }
    }
  }
}

5、在lang文件夹下,新建文档 命名:app.js

app.js文档代码如下

import { createRequire } from "module";

const require = createRequire(import.meta.url);
var path = require("path");
var fs = require("fs");
var xlsx = require("node-xlsx").default;
const TABLE_KEY = "lang_key";
var _OutputPath = "../../src/lang/";

function isExits(path) {
  try {
    fs.statSync(path);
    return true;
  } catch (e) {
    return false;
  }
}

function loopSheet(data) {
  if (data) {
    let _myData = {};
    let _myIndex = {};
    //解析表头
    while (data.length > 0) {
      const _rData = data.shift();
      if (_rData.length > 0) {
        if (_rData[0] == TABLE_KEY) {
          let len = _rData.length > 4 ? 4 : _rData.length; // 这里数字表示要生产几个文件, 3表示生产两种多语言,假设4,便是生产3种多语言
          for (let index = 1; index < len; index++) {
            const element = _rData[index];
            _myData[element] = {};
            _myIndex[element] = index;
          }
          break;
        }
      }
    }
    console.log("====================================");
    console.log("语言结构:", _myIndex);
    console.log("语言结构:", _myData);
    console.log("====================================");
    let _keys1 = Object.keys(_myData);
    let _keys2 = Object.keys(_myIndex);
    //确保结构是对称的
    if (
      _keys1.length > 0 &&
      _keys2.length > 0 &&
      _keys1.length == _keys2.length
    ) {
      //TODO:做数据的遍历、存储到需要的位置
      for (let row = 0; row < data.length; row++) {
        const _rData = data[row];
        for (const key in _myIndex) {
          if (_myIndex.hasOwnProperty(key)) {
            const _keyIndex = _myIndex[key];
            _myData[key][_rData[0]] = _rData[_keyIndex];
          }
        }
      }
    }
    console.log("====================================");
    console.log("数据汇总:", _myData);
    console.log("====================================");

    //写出文件
    for (const key in _myData) {
      if (_myData.hasOwnProperty(key)) {
        const _sheetData = _myData[key];
        let _file = _OutputPath + key + ".ts";
        let str =
          "const " +
          key +
          " = " +
          JSON.stringify(_sheetData, null, "\t") +
          ";\n";
        str += "export default " + key + ";";

        fs.writeFile(_file, str, function (err) {
          if (err) {
            res.status(500).send("Server is error...");
          }
        });
      }
    }
  }
}

function parse(path) {
  let _isFile = isExits(path);
  if (_isFile) {
    // var arr = path.split("/");
    // delete arr[arr.length - 1];
    // _OutputPath = arr.join("/");
    console.log("====================================");
    console.log("_OutputPath:", _OutputPath);
    console.log("====================================");
    const workSheetsFromFile = xlsx.parse(path);
    if (workSheetsFromFile) {
      for (let index = 0; index < workSheetsFromFile.length; index++) {
        const sheet = workSheetsFromFile[index];
        console.log("====================================");
        console.log(sheet.name);
        console.log("====================================");
        loopSheet(sheet.data);
      }
    } else {
      console.log("====================================");
      console.log("文件出错!");
      console.log("====================================");
    }
  } else {
    console.log("====================================");
    console.log("文件不存在!");
    console.log("====================================");
  }
}

parse(process.argv[2]);

6、确认在src目录下有一个文件夹名字为lang 如下图

没有就必须创建文件夹名字为lang

7、使用xlsx表格导出多语言文档,xlsx表格也必须放在tools的lang目录下,xlsx表格名字可以随意命名,这里我命名为:TEXAS_i18n.xlsx

8、TEXAS_i18n.xlsx的书写格式如下,这个格式是不可更改的,需要严格对应

9.运行这个脚本需要安装node 确保电脑已经安装好node, 建议是14版本以上

10,运行脚本,生成多语言,需要在tools的lang目录运行

10.1先运行npm i

npm i

10.2.在运行

node .\app.js .\TEXAS_i18n.xlsx

如图:

11、查看运行结果,你会发现,在src的lang目录下,会生成三个文件

如果需要生成更多,请更改app,js文件个数,其他都不要改动就可

好了,编写完成,有需要请自行查看!!!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1888733.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

实验室必备神器:PFA气体装置,精准控制每一丝气体!

PFA气体吸收装置是一种高效的气体处理设备&#xff0c;主要用于捕获、存储和转移各种气体样本&#xff0c;特别是在需要高纯度气体的应用场合中表现出色。以下是关于PFA气体吸收装置的详细介绍&#xff1a; 一、特点与优势 1. 高效吸收&#xff1a;采用先进的物理和化学吸收技术…

归并排序详解(递归与非递归)

归并排序是建立在归并操作上的一种有效算法。该算法是采用分治法的一个非常典型的应用。将已有序的子序列合并&#xff0c;得到完全有序的序列&#xff1b;即先使每个子序列有序&#xff0c;再使子序列间断有序。若将两个有序表合并成一个有序表&#xff0c;成为二路归并。 一…

The Forest Enemy Pack(2D动画角色游戏模型)

这个包包含14个适用于platformer和2d rpg游戏的动画角色。 动画总帧数:1785 用于动画的所有精灵都具有透明背景,并准备有1500x1200和750x600两种尺寸。 对于每个角色,你也可以找到具有单独身体部位的精灵表,这样你就可以轻松地制作自己的动画。它们有PNG和PSD格式。 示例场…

苏东坡传-读书笔记八

孤馆灯青&#xff0c;野店鸡号&#xff0c;旅枕梦残。渐月华收练&#xff0c;晨霜耿耿&#xff0c;云山摛锦&#xff0c;朝露漙漙。世路无穷&#xff0c;劳生有限&#xff0c;似此区区长鲜饮。微吟罢&#xff0c;凭征鞍无语&#xff0c;往事千端。 翻译如下 孤独的客栈里&#…

Springboot整合RedisTemplate以及业务工具类示例

docker安装Redis参考我另一篇博客Docker安装Redis及持久化 一、Get-Started 依赖 <!-- https://mvnrepository.com/artifact/org.springframework.boot/spring-boot-starter-data-redis --> <dependency><groupId>org.springframework.boot</groupId>…

C# 类型转换之显式和隐式

文章目录 1、显式类型转换2. 隐式类型转换3. 示例4. 类型转换的注意事项5. 类型转换的应用示例总结 在C#编程中&#xff0c;类型转换是一个核心概念&#xff0c;它允许我们在程序中处理不同类型的数据。类型转换可以分为两大类&#xff1a;显式类型转换&#xff08;Explicit Ca…

ctfshow-web入门-命令执行(web118详解)Linux 内置变量与Bash切片

输入数字和小写字母&#xff0c;回显 evil input 查看源码&#xff0c;发现这里会将提交的参数 code 传给 system 函数 使用 burpsuite 抓包进行单个字符的模糊测试 fuzz&#xff1a; 发现过滤掉了数字和小写字母以及一些符号&#xff0c;下面框起来的部分是可用的 结合题目提…

手把手教你:如何在51建模网免费下载3D模型?

作为国内领先的3D互动展示平台&#xff0c;51建模网不仅汇聚了庞大的3D模型资源库&#xff0c;供用户免费下载&#xff0c;更集成了在线编辑、格式转换、内嵌展示及互动体验等一站式功能&#xff0c;为3D创作者及爱好者搭建起梦想与现实的桥梁。 如何在51建模网免费下载3D模型…

恶意软件是什么意思?常见的恶意软件类型

您可能听说过很多有关恶意软件感染和运行服务器的危险的信息。但是&#xff0c;您可能还不清楚这在现实生活中意味着什么&#xff0c;或者该如何处理。让我们来了解一下&#xff1a;当人们谈论恶意软件时&#xff0c;他们真正指的是什么&#xff1f; 恶意软件是恶意软件的缩写&…

VehicleSPY的安装与使用

VehicleSPY介绍 Vehicle Spy 是美国英特佩斯公司的一款集成了诊断、节点/ECU仿真、数据获取、自动测试和车内通信网络监控等功能的工具&#xff0c;Vehicle Spy软件支持的应用场景很多&#xff0c;无法一一列举&#xff0c;以下是一些常见的应用&#xff1a; 总线监控&#x…

从百数教学看产品设计:掌握显隐规则,打造极致用户体验

字段显隐规则允许通过一个控件&#xff08;如复选框、单选按钮或下拉菜单&#xff09;来控制其他控件&#xff08;如文本框、日期选择器等&#xff09;和标签页&#xff08;如表单的不同部分&#xff09;的显示或隐藏。 这种规则通常基于用户的选择或满足特定条件来触发&#…

记一次阿里云服务器java应用无法响应且无法远程连接的问题排查

问题表现 java服务无响应&#xff0c;无法远程链接到服务器。 今天中午12点多&#xff0c;应用直接崩溃。后续进入到服务器&#xff0c;发现java进程都不在了&#xff0c; 排查过程 先安装atop工具 安装、配置并使用atop监控工具 等下次再出现时看相关时间点日志&#xff…

慢病精准预测:大模型 + 多模态融合

慢病精准预测&#xff1a;大模型 多模态融合 慢病预测算法拆解子解法1&#xff1a;多模态数据集成子解法2&#xff1a;实时数据处理与更新子解法3&#xff1a;采用大型语言多模态模型&#xff08;LLMMs&#xff09;进行深度学习分析 慢病预测更多模态 论文&#xff1a;https:/…

DC-DC 5V1A输出异步升压恒压芯片FP6291-5V/1A(5W)芯片,5V、9V、12V可调输出

FP6291LR-G1:DC-DC异步升压恒压5V/1A&#xff08;5W&#xff09;芯片&#xff0c;2.6-5.5V供电&#xff0c;内置MOS&#xff0c;最高输出5-12V/5-7W&#xff0c;输入限流可调 FP6291是一个电流模式升压DC-DC转换器。它的PWM电路内置0.2Ω功率MOSFET使该调节器高效。内部补偿网…

第4章 第一个程序

第4章 第一个程序 4.1 一个源程序从写出到执行的过程 第一步&#xff1a;编写汇编程序第二步&#xff1a;对源程序进行编译连接第三步&#xff1a;执行可执行文件中的程序 4.2.源程序 汇编语言中包含两种指令&#xff1a;汇编指令 和 伪指令 汇编指令&#xff1a;有对应机器…

挖逻辑漏洞不懂数据权限怎么赚大钱?

从开发的角度看权限漏洞的最后一篇了&#xff0c;也就是数据权限篇&#xff0c;虽然之前的都没什么人看&#xff0c;但想了想还是花时间写完了&#xff0c;也算有始有终吧。 0x00 相比于之前的未授权《一文理解权限类漏洞产生的原因之未授权篇》与功能权限《权限类漏洞解析—…

【实战场景】记一次UAT jvm故障排查经历

【实战场景】记一次UAT jvm故障排查经历 开篇词&#xff1a;干货篇&#xff1a;1.查看系统资源使用情况2.将十进制进程号转成十六进制3.使用jstack工具监视进程的垃圾回收情况4.输出指定线程的堆内存信息5.观察日志6.本地环境复现 总结篇&#xff1a;我是杰叔叔&#xff0c;一名…

20_系统测试与维护

目录 测试基础知识 测试原则 动态测试 静态测试 测试策略 测试阶段 测试用例设计 黑盒测试用例设计 白盒测试用例设计 McCabe度量法 鲁棒性测试 缺陷探测率(Defect Detection Percentage,DDP) 调试 系统维护基础 系统转换 系统维护指标 软件容错技术 嵌入式安…

Java语言开发的一套智慧产科系统源码:产科专科电子病历系统源码

Java语言开发的一套智慧产科系统源码&#xff1a;产科专科电子病历系统源码 系统概述 电子病历系统是以住院病人为中心&#xff0c;面向医生以及护士为主的&#xff0c;涉及临床治疗、护理等业务的临床信息系统&#xff0c;以电子信息技术为手段&#xff0c;实时采集病人在整个…

设计模式-结构型-08-组合模式

文章目录 1、学校院系展示需求2、组合模式基本介绍3、组合模式示例3.1、 解决学校院系展示&#xff08;透明模式1&#xff09;3.2、高考的科目&#xff08;透明模式2&#xff09;3.3、高考的科目&#xff08;安全组合模式&#xff09; 4、JDK 源码分析5、注意事项和细节 1、学校…