MD & MDX
ドキュメント、ブログ記事、コンテンツページがローカライズされた .md または .mdx ファイルにある場合は、@better-translate/md を使用します。
このパッケージはコア翻訳機能を置き換えるものではありません。すでに作成した翻訳機能からロケールルールを読み取ります。
1. パッケージをインストールする
npm install @better-translate/core @better-translate/md2. 翻訳機能を作成する
src/i18n.ts を作成します:
ts
1import { configureTranslations } from "@better-translate/core";23const en = {4 docs: {5 title: "Docs",6 },7} as const;89const es = {10 docs: {11 title: "Documentacion",12 },13} as const;1415export const translator = await configureTranslations({16 availableLocales: ["en", "es"] as const,17 defaultLocale: "en",18 fallbackLocale: "en",19 messages: { en, es },20});3. コンテンツフォルダを作成する
同じルート配下にロケールごとに1つのフォルダを配置します:
txt
1content/docs/2 en/3 getting-started.mdx4 es/5 getting-started.mdx4. Markdownヘルパーを作成する
src/docs.ts を作成します:
ts
1import { createMarkdownHelpers } from "@better-translate/md";23import { translator } from "./i18n";45export const docs = createMarkdownHelpers(translator, {6 rootDir: "./content/docs",7});5. ドキュメントを読み込む
ts
1import { docs } from "./docs";23const englishDoc = await docs.getDocument("getting-started", {4 locale: "en",5});67const spanishDoc = await docs.getDocument("getting-started", {8 locale: "es",9});6. 出力が必要なときにコンパイルする
ts
1const compiled = await docs.compileDocument("getting-started", {2 locale: "en",3});45compiled.kind; // "md" または "mdx"6compiled.path;7compiled.usedFallback;サーバーヘルパーを使用するタイミング
アプリですでにサーバー上でリクエストロケールを解決している場合は、@better-translate/md/server を使用して、Markdownの読み込みが同じリクエストロケールに自動的に従うようにします。
ローカライズされたMarkdownを自動生成する
CLIの markdown.rootDir オプションを使用して、ジェネレーターでMarkdownファイルを翻訳します:CLIガイド