@intlayer/docs 9.0.0-canary.2 → 9.0.0-canary.20

package/docs/zh/intlayer_with_express.md

@@ -32,10 +32,6 @@ author: aymericzip
 
 `express-intlayer` 是一个强大的国际化 (i18n) 中间件，适用于 Express 应用程序，旨在通过根据客户端的偏好提供本地化响应，使您的后端服务能够全球化访问。
 
-## 为什么要国际化您的后端？
-
-国际化您的后端对于有效服务全球受众至关重要。它使您的应用程序能够以每个用户的首选语言提供内容和消息。这种能力提升了用户体验，并通过使应用程序更易于访问和更贴近不同语言背景的用户，扩大了应用程序的影响范围。
-
 ### 实际使用场景
 
 - **以用户语言显示后端错误**：当发生错误时，以用户的母语显示消息可以提高理解力并减少挫败感。这对于可能在前端组件（如弹出消息或模态框）中显示的动态错误消息尤为有用。
@@ -64,24 +60,44 @@ See [Application Template](https://github.com/aymericzip/intlayer-express-templa
 
 要开始使用 `express-intlayer`，请使用 npm 安装该包：
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> `--interactive` 标志是可选的。如果您是 AI 代理，请使用 `intlayer-cli init`。
+
+> 该命令将检测您的环境并安装所需的软件包。例如：
+
 ```bash packageManager="npm"
 npm install intlayer express-intlayer
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer express-intlayer
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer express-intlayer
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer express-intlayer
-bun x intlayer init
 ```
 
 ### 配置
@@ -253,25 +269,6 @@ export default config;
 
 ### Git 配置
 
-建议忽略 Intlayer 生成的文件，这样可以避免将它们提交到您的 Git 仓库中。
-
-### VS Code 扩展
-
-为了提升您使用 Intlayer 的开发体验，您可以安装官方的 **Intlayer VS Code 扩展**。
-
-[从 VS Code 市场安装](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
-
-该扩展提供：
-
-- 翻译键的 **自动补全**。
-- 缺失翻译的 **实时错误检测**。
-- 翻译内容的 **内联预览**。
-- 轻松创建和更新翻译的 **快速操作**。
-
-有关如何使用该扩展的更多详细信息，请参阅 [Intlayer VS Code 扩展文档](https://intlayer.org/doc/zh/vs-code-extension)。
-
-### Git 配置
-
 建议忽略 Intlayer 生成的文件。这样可以避免将它们提交到您的 Git 仓库。
 
 为此，您可以将以下内容添加到您的 `.gitignore` 文件中：

package/docs/zh/intlayer_with_fastify.md

@@ -61,27 +61,43 @@ author: aymericzip
 要开始使用 `fastify-intlayer`，请使用 npm 安装软件包：
 
 ```bash packageManager="npm"
-npm install intlayer fastify-intlayer
-npx intlayer init
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> `--interactive` 标志是可选的。如果您是 AI 代理，请使用 `intlayer-cli init`。
 
+> 该命令将检测您的环境并安装所需的软件包。例如：
+
+```bash packageManager="npm"
+npm install intlayer fastify-intlayer
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer fastify-intlayer
-pnpm intlayer init
-
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer fastify-intlayer
-yarn intlayer init
-
 ```
 
 ```bash packageManager="bun"
 bun add intlayer fastify-intlayer
-bun x intlayer init
-
 ```
 
 ### 设置

package/docs/zh/intlayer_with_hono.md

@@ -62,24 +62,44 @@ See [Application Template](https://github.com/aymericzip/intlayer-hono-template)
 
 要开始使用 `hono-intlayer`，请使用 npm 安装该包：
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> `--interactive` 标志是可选的。如果您是 AI 代理，请使用 `intlayer-cli init`。
+
+> 该命令将检测您的环境并安装所需的软件包。例如：
+
 ```bash packageManager="npm"
 npm install intlayer hono-intlayer
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer hono-intlayer
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer hono-intlayer
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer hono-intlayer
-bun x intlayer init
 ```
 
 ### 设置

package/docs/zh/intlayer_with_lynx+react.md

@@ -67,222 +67,6 @@ Intlayer 不仅仅是一个 i18n 解决方案，还提供了一个**自托管的
 
 ---
 
-## 第一步：安装依赖
-
-在您的 Lynx 项目中，安装以下包：
-
-```bash packageManager="npm"
-npm install intlayer react-intlayer lynx-intlayer
-npx intlayer init
-```
-
-```bash packageManager="pnpm"
-pnpm add intlayer react-intlayer lynx-intlayer
-pnpm intlayer init
-```
-
-```bash packageManager="yarn"
-yarn add intlayer react-intlayer lynx-intlayer
-yarn intlayer init
-```
-
-```bash packageManager="bun"
-bun add intlayer react-intlayer lynx-intlayer
-bun x intlayer init
-```
-
-### 包说明
-
-- **intlayer**  
-  核心 i18n 工具包，用于配置、字典内容、类型生成和 CLI 命令。
-
-- **react-intlayer**  
-  React 集成，提供上下文提供者和 React hooks，您将在 Lynx 中使用它来获取和切换语言。
-
-- **lynx-intlayer**  
-  Lynx 集成，提供将 Intlayer 与 Lynx 打包器集成的插件。
-
----
-
-## 第二步：创建 Intlayer 配置
-
-在项目根目录（或任何方便的位置）创建一个 **Intlayer 配置** 文件。它可能如下所示：
-
-```ts fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
-import { Locales, type IntlayerConfig } from "intlayer";
-
-const config: IntlayerConfig = {
-  internationalization: {
-    locales: [
-      Locales.ENGLISH,
-      Locales.FRENCH,
-      Locales.SPANISH,
-      // ... 添加您需要的其他语言
-    ],
-    defaultLocale: Locales.ENGLISH,
-  },
-};
-
-export default config;
-```
-
-在此配置中，您可以：
-
-- 配置您的**支持语言列表**。
-- 设置一个**默认**语言。
-- 以后，您可以添加更高级的选项（例如日志、自定义内容目录等）。
-- 查看 [Intlayer 配置文档](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/configuration.md) 了解更多。
-
-## 第三步：将 Intlayer 插件添加到 Lynx 打包器
-
-要在 Lynx 中使用 Intlayer，您需要将插件添加到 `lynx.config.ts` 文件中：
-
-```ts fileName="lynx.config.ts"
-import { defineConfig } from "@lynx-js/rspeedy";
-import { pluginIntlayerLynx } from "lynx-intlayer/plugin";
-
-export default defineConfig({
-  plugins: [
-    // ... 其他插件
-    pluginIntlayerLynx(),
-  ],
-});
-```
-
-## 第四步：添加 Intlayer 提供者
-
-为了在您的应用程序中同步用户语言，您需要使用 `react-intlayer` 中的 `IntlayerProvider` 组件包装您的根组件。
-
-此外，您需要添加 `intlayerPolyfill` 函数文件，以确保 Intlayer 能够正常工作。
-
-```tsx fileName="src/index.tsx"
-import { root } from "@lynx-js/react";
-
-import { App } from "./App.js";
-import { IntlayerProvider } from "react-intlayer";
-import { intlayerPolyfill } from "lynx-intlayer";
-
-intlayerPolyfill();
-
-root.render(
-  <IntlayerProvider>
-    <App />
-  </IntlayerProvider>
-);
-
-if (import.meta.webpackHot) {
-  import.meta.webpackHot.accept();
-}
-```
-
-## 第五步：声明您的内容
-
-在项目中的任何位置创建**内容声明**文件（通常在 `src/` 中），使用 Intlayer 支持的任何扩展格式：
-
-- `.content.json`
-- `.content.ts`
-- `.content.tsx`
-- `.content.js`
-- `.content.jsx`
-- `.content.mjs`
-- `.content.mjx`
-- `.content.cjs`
-- `.content.cjx`
-- 等等。
-
-示例：
-
-```tsx fileName="src/app.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
-import { t, type Dictionary } from "intlayer";
-
-const appContent = {
-  key: "app",
-  content: {
-    title: "React",
-    subtitle: t({
-      en: "on Lynx",
-      fr: "sur Lynx",
-      es: "en Lynx",
-    }),
-    description: t({
-      zh: "点击标志并享受乐趣！",
-      en: "Tap the logo and have fun!",
-      fr: "Appuyez sur le logo et amusez-vous!",
-      es: "¡Toca el logo y diviértete!",
-    }),
-    hint: [
-      t({
-        zh: "编辑",
-        en: "Edit",
-        fr: "Modifier",
-        es: "Editar",
-      }),
-      " src/App.tsx ",
-      t({
-        zh: "以查看更新！",
-        en: "to see updates!",
-        fr: "pour voir les mises à jour!",
-        es: "para ver actualizaciones!",
-      }),
-    ],
-  },
-} satisfies Dictionary;
-
-export default appContent;
-```
-
-```json fileName="src/app.content.json" contentDeclarationFormat="json"
-{
-  "$schema": "https://intlayer.org/schema.json",
-  "key": "app",
-  "content": {
-    "title": "React",
-    "subtitle": {
-      "nodeType": "translation",
-      "translation": {
-        "en": "on Lynx",
-        "zh": "在 Lynx 上",
-        "fr": "sur Lynx",
-        "es": "en Lynx"
-      }
-    },
-"description": {
-  "nodeType": "translation",
-  "translation": {
-    "zh": "点击标志并享受乐趣！",
-    "en": "Tap the logo and have fun!",
-    "fr": "Appuyez sur le logo et amusez-vous!",
-    "es": "¡Toca el logo y diviértete!"
-  }
-},
-"hint": [
-  {
-    "nodeType": "translation",
-    "translation": {
-      "zh": "编辑",
-      "en": "Edit",
-      "fr": "Modifier",
-      "es": "Editar"
-    }
-  },
-  " src/App.tsx ",
-  {
-    "nodeType": "translation",
-    "translation": {
-      "zh": "查看更新！",
-      "en": "to see updates!",
-      "fr": "pour voir les mises à jour!",
-      "es": "para ver actualizaciones!"
-    }
-  }
-]
-}
-```
-
-> 有关内容声明的详细信息，请参阅 [Intlayer 的内容文档](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/dictionary/content_file.md)。
-
----
-
 ## 第 4 步：在组件中使用 Intlayer
 
 在子组件中使用 `useIntlayer` 钩子以获取本地化内容。
@@ -341,49 +125,6 @@ export const App = () => {
 
 ---
 
-## （可选）第 5 步：更改应用程序语言环境
-
-要从组件内部切换语言环境，可以使用 `useLocale` 钩子的 `setLocale` 方法：
-
-```tsx fileName="src/components/LocaleSwitcher.tsx"
-import { type FC } from "react";
-import { getLocaleName } from "intlayer";
-import { useLocale } from "react-intlayer";
-
-export const LocaleSwitcher: FC = () => {
-  const { setLocale, availableLocales, locale } = useLocale();
-
-  return (
-    <view
-      style={{
-        display: "flex",
-        flexDirection: "row",
-        justifyContent: "center",
-        alignItems: "center",
-        gap: 10,
-      }}
-    >
-      {availableLocales.map((localeEl) => (
-        <text
-          key={localeEl}
-          style={{
-            color: localeEl === locale ? "#fff" : "#888",
-            fontSize: "12px",
-          }}
-          bindtap={() => setLocale(localeEl)}
-        >
-          {getLocaleName(localeEl)}
-        </text>
-      ))}
-    </view>
-  );
-};
-```
-
-这将触发使用 Intlayer 内容的所有组件的重新渲染，现在显示新语言环境的翻译。
-
-> 有关更多详细信息，请参阅 [`useLocale` 文档](https://github.com/aymericzip/intlayer/blob/main/docs/docs/zh/packages/react-intlayer/useLocale.md)。
-
 ## 配置 TypeScript（如果您使用 TypeScript）
 
 Intlayer 在一个隐藏文件夹中生成类型定义（默认是 `.intlayer`），以改进自动补全并捕获翻译错误：

package/docs/zh/intlayer_with_nestjs.md

@@ -33,24 +33,6 @@ history:
 
 `express-intlayer` 是一个功能强大的国际化（i18n）中间件，适用于 Express 应用程序，旨在通过根据客户端的偏好提供本地化响应，使您的后端服务能够面向全球用户。由于 NestJS 构建在 Express 之上，您可以将 `express-intlayer` 无缝集成到您的 NestJS 应用中，有效处理多语言内容。
 
-## 为什么要对后端进行国际化？
-
-对后端进行国际化对于有效服务全球用户至关重要。它允许您的应用程序以每个用户偏好的语言提供内容和消息。这种能力提升了用户体验，并通过使应用程序对不同语言背景的人更易访问和相关，扩大了应用的影响范围。
-
-### 实际应用场景
-
-- **以用户语言显示后端错误**：当发生错误时，以用户的母语显示消息可以提高理解度并减少挫败感。这对于可能在前端组件如提示框或模态框中显示的动态错误消息尤其有用。
-
-- **检索多语言内容**：对于从数据库获取内容的应用程序，国际化确保您可以以多种语言提供这些内容。这对于需要以用户偏好语言显示产品描述、文章及其他内容的电商平台或内容管理系统至关重要。
-
-- **发送多语言电子邮件**：无论是事务性电子邮件、营销活动还是通知，以收件人语言发送邮件都能显著提高参与度和效果。
-
-- **多语言推送通知**：对于移动应用程序，以用户偏好的语言发送推送通知可以增强互动和用户留存。这种个性化的触达使通知更具相关性和可操作性。
-
-- **其他通信**：来自后端的任何形式的通信，如短信、系统警报或用户界面更新，使用用户的语言都有助于确保清晰度并提升整体用户体验。
-
-通过对后端进行国际化，您的应用不仅尊重文化差异，还能更好地符合全球市场需求，这使其成为扩展您的服务到全球的关键步骤。
-
 ## 入门指南
 
 ### 创建一个新的 NestJS 项目
@@ -64,24 +46,44 @@ nest new my-nest-app
 
 要开始使用 `express-intlayer`，请使用 npm 安装该包：
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> `--interactive` 标志是可选的。如果您是 AI 代理，请使用 `intlayer-cli init`。
+
+> 该命令将检测您的环境并安装所需的软件包。例如：
+
 ```bash packageManager="npm"
 npm install intlayer express-intlayer
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer express-intlayer
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer express-intlayer
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer express-intlayer
-bun x intlayer init
 ```
 
 ### 配置 tsconfig.json

package/docs/zh/intlayer_with_next-i18next.md

@@ -557,24 +557,44 @@ Intlayer 帮助你保持 JSON 翻译同步，测试缺失的键，并在需要
 
 安装 intlayer 依赖：
 
+```bash packageManager="npm"
+npx intlayer@canary init --interactive    # v9
+# npx intlayer init                       # v8
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive   # v9
+# pnpm dlx intlayer init                      # v8
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive   # v9
+# yarn dlx intlayer init                      # v8
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive   # v9
+# bunx intlayer init                      # v8
+```
+
+> `--interactive` 标志是可选的。如果您是 AI 代理，请使用 `intlayer-cli init`。
+
+> 该命令将检测您的环境并安装所需的软件包。例如：
+
 ```bash packageManager="npm"
 npm install intlayer @intlayer/sync-json-plugin --save-dev
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer @intlayer/sync-json-plugin --save-dev
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer @intlayer/sync-json-plugin --dev
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/sync-json-plugin --dev
-bun x intlayer init
 ```
 
 ```ts fileName="intlayer.config.ts"