Nuxt 翻譯管理器

適用於 nuxt 和 nuxt-i18n 的簡單易用翻譯管理器，允許從單一 CSV 檔案管理翻譯。

Nuxt v4 準備就緒 ✨

對於 Nuxt V4 範例，您可以查看使用 Nuxt V4 && nuxt-i18n 模組的入門範本

功能

從單一 CSV 檔案管理翻譯
每當 csv 檔案更新時，熱模組重新載入

快速設定

將 nuxt-translation-manager 依賴項新增至您的專案

npx nuxi@latest module add translation-manager

手動安裝

將 nuxt-translation-manager 依賴項新增至您的專案

npm install -D nuxt-translation-manager

pnpm install -D nuxt-translation-manager

yarn add -D nuxt-translation-manager

將 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-US	fr	de
hello	Hello	Bonjour	Hallo
goodbye	Goodbye	Au revoir	Auf Wiedersehen
thanks	Thanks	Merci	Danke

請務必在標頭列中使用 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