Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。

translation-manager
nuxt-translation-manager

一个简单易用的 Nuxt 和 Nuxt-i18n 翻译管理器,允许从单个 CSV 文件管理翻译。

Nuxt 翻译管理器

npm versionnpm downloadsLicenseNuxt

temp-Image4v-TX6-F.jpg

一个简单易用的 nuxtnuxt-i18n 翻译管理器,允许从单个 CSV 文件管理翻译。

Nuxt v4 准备就绪

对于 Nuxt V4 示例,您可以查看此使用 Nuxt V4 && nuxt-i18n 模块 的入门项目

特性

  • 从单个 CSV 文件管理翻译
  • CSV 文件更新时,热模块重新加载

快速设置

  1. nuxt-translation-manager 依赖项添加到您的项目中
npx nuxi@latest module add translation-manager

手动安装

  1. nuxt-translation-manager 依赖项添加到您的项目中
npm install -D nuxt-translation-manager

pnpm install -D nuxt-translation-manager

yarn add -D nuxt-translation-manager
  1. nuxt-translation-manager 添加到 nuxt.config.ts 文件的 modules 部分
export default defineNuxtConfig({
  modules: ['nuxt-translation-manager']
})

就是这样!您现在可以在您的 Nuxt 应用中使用 Nuxt 翻译管理器 ✨

用法

在您的 langDir 中创建 translations.csv 文件

echo 'Key,"en-US","es-ES","ca-ES"
login,"Login","Acceder","Accedir"' > path-to-your-langDir/translations.csv
# replace `path-to-your-langDir`

这将生成一个如下所示的 CSV 文件

en-USfrde
helloHelloBonjourHallo
goodbyeGoodbyeAu revoirAuf Wiedersehen
thanksThanksMerciDanke

**请务必使用** lang-code **格式作为表头行,例如** es-ES

**请务必在您的 CSV 编辑器中设置合适的分割符(默认情况下为逗号)** ,

**您可以在 CSV 文件中使用注释**,使用 #

✨ 提示:您可以使用 VSCode 的 Edit CSV 扩展vscode 中管理您的 CSV 文件

查看原始 CSV 代码
Key,"English, en-US","French, fr","German, de"
hello,"Hello","Bonjour","Hallo"
goodbye,"Goodbye","Au revoir","Auf Wiedersehen"
thanks,"Thanks","Merci","Danke"
# COMMENTS TEST
comment-test,"Comment test","Test comentario","Test comentari"
### MULTILINE COMMENT ###
### ANOTHER COMMENT ####
comment-multi,"Comment test","Test comentario","Test comentari"

选项

// config key
export default defineNuxtConfig({
  'translation-manager': {}
})

interface ModuleOptions {
  /**
   * nuxt-i18n lang dir
   *
   * @default 'locales'
   */
  langDir?: string
  /**
   * csv file name without .csv file extension
   *
   * @default 'translations'
   */
  translationFileName?: string
  /**
   * where to store json files
   *
   * @default 'langDir'
   */
  outputDir?: string
  /**
   * csv separator character
   *
   * @default ','
   */
  separator?: string
}

开发

# Install dependencies
pnpm install

# Generate type stubs
pnpm run dev:prepare

# Develop with the playground
pnpm run dev

# Build the playground
pnpm run dev:build

# Run ESLint
pnpm run lint

# Run Vitest
pnpm run test
pnpm run test:watch

# Release new version
pnpm run release

致谢

Danny Connell 编写的 Quasalang CLI 启发