快速開始

Fastify

本頁示範 Intor 在 Fastify 專案中的最小整合流程。

安裝

本頁假設 Fastify 專案環境已就緒。
相關設定請參考：Fastify

Intor 的 Fastify 整合使用 fastify-plugin，請先安裝：

npm install fastify-plugin
yarn add fastify-plugin
pnpm add fastify-plugin
bun add fastify-plugin

安裝 Intor：

npm install intor
yarn add intor
pnpm add intor
bun add intor

專案結構

index.json
U
index.json
U
index.ts
U
intor-config.ts
U

整合步驟

♯1 翻譯內容

在專案中建立 messages 資料夾，並依語系建立子資料夾，每個語系提供一個 index.json。

index.json
U
index.json
U
{
  "hello": "Hello, {name}",
  "rich": "A <tag>text</tag>."
}
{
  "hello": "Bonjour, {name}",
  "rich": "Un <tag>texte</tag>."
}

♯2 設定檔

在 src/ 下建立 intor-config.ts。
本範例採用最基本的翻譯內容載入方式，直接將 messages 定義於設定檔中。

詳見：載入翻譯內容 

intor-config.ts
U
import { defineIntorConfig } from "intor";
import EN from "../messages/en/index.json";
import FR from "../messages/fr/index.json";

export const intorConfig = defineIntorConfig({
  defaultLocale: "en",
  supportedLocales: ["en", "fr"],
  messages: {
    en: EN,
    fr: FR,
  },
});

♯3 初始化

在 src/ 下建立 index.ts。
初始化 Fastify 應用程式，並註冊 intorFastifyPlugin。

index.ts
U
import Fastify from "fastify";
import { intorFastifyPlugin } from "intor/fastify";
import { intorConfig } from "./intor-config";

const fastify = Fastify();

fastify.register(intorFastifyPlugin, { config: intorConfig });

fastify.listen({ port: 3000 }, function (err, address) {
  console.log(`Server is now listening on ${address}`);
});

使用範例

透過 getTranslator 取得翻譯相關能力：

  • t：取得對應文字
  • tRich：渲染包含語意 tag 的結構化翻譯內容
index.ts
M
import { getTranslator } from "intor/fastify";

// ...

fastify.get("/", async function (request, reply) {
  const { t, tRich } = await getTranslator(intorConfig, request);

  reply.send({
    hello: t("hello", { name: "Intor" }),
    rich: tRich("rich", { tag: (children) => `<b>${children}</b>` }),
  });
});

// ...

作為便利方式，翻譯能力亦可直接自 request 取得，但此方式下型別推導能力有限。

fastify.get("/", async function (request, reply) {
  reply.send({
    hello: request.t("hello", { name: "Intor" }),
    rich: request.tRich("rich", { tag: (children) => `<b>${children}</b>` }),
  });
});
型別安全
深入了解如何在 Fastify 專案中啟用 Intor 的型別安全機制。

On this page