用于从.vue文件中提取字符串以进行国际化的工具

eeq64g8w  于 2023-05-29  发布在  Vue.js
关注(0)|答案(2)|浏览(262)

我有一个Vue.js 2.x Web应用程序,我希望通过从我的.vue文件中提取所有字符串来国际化它。
我的目标是识别可能需要翻译的字符串,即使可能有一些字符串不需要翻译。是否有任何现有的工具可用于从.vue文件中提取字符串?
如果没有任何专用工具,我正在考虑使用vue-template-compiler实现我自己的解决方案。

mklgxw1f

mklgxw1f1#

如果你正在使用VS Code,i18n Ally插件工作得很好:
https://marketplace.visualstudio.com/items?itemName=Lokalise.i18n-ally
这个插件可以检测硬编码字符串,可能需要翻译。

vatpfxk5

vatpfxk52#

建议使用一些国际化框架。一个很好的例子是Lingui-一个JavaScript库,用于JavaScript项目的内部化(i18 n),包括React,Vue,Node.js等。
Lingui是一个简单而强大的国际化框架。他们最近发布了一个Vue.js Extractor,它提供了一个处理Vue.js文件的自定义提取器。
消息提取是国际化过程中必不可少的一步。它涉及分析代码并提取其中定义的所有消息,以便消息目录始终与源代码保持最新。请访问Message Extraction文章,了解它在临桂中的工作原理。

使用Lingui本地化时,您的vue文件可能会显示的示例:

<script setup lang="ts">
import { i18n } from "@lingui/core"
i18n._("Setup message")
let x: string | number = 1
</script>

<script lang="ts">
import { defineComponent } from "vue"
import { i18n } from "@lingui/core"

export default defineComponent({
  data() {
    return {
      i18n,
      scriptString: i18n.t("Script message"),
    }
  },
})
</script>

<template>
  {{ (x as number).toFixed(2) }}
  {{ i18n.t({ id: "custom.id", message: "My message" }) }}
  {{
    i18n.t({
        message: "My descriptor message",
        id: "my.message",
        comment: "Message comment",
      })
  }}
  {{ i18n._("id used as message") }}
  {{ i18n.t({ id: "My message without ID and context" }) }}
</template>

相关问题