@intlayer/docs 7.2.0 → 7.2.3

package/docs/tr/intlayer_with_svelte_kit.md

@@ -44,6 +44,14 @@ Intlayer ile şunları yapabilirsiniz:
 
 Başlamak için yeni bir SvelteKit projesi oluşturun. İşte oluşturacağımız son yapı:
 
+<iframe
+  src="https://stackblitz.com/github/aymericzip/intlayer-sveltekit-template?embed=1&ctl=1&file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - Cách quốc tế hóa ứng dụng của bạn bằng Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
 ```bash
 .
 ├── intlayer.config.ts
@@ -547,8 +555,9 @@ export const load: Load = ({ params }) => {
 	let { children, data }: { children: Snippet, data: LayoutData } = $props();
 
 	// Yönlendirmeden alınan locale ile Intlayer'ı başlat
-	setupIntlayer(data.locale);
-
+  $effect(() => {
+      setupIntlayer(data.locale);
+  });
 	// Layout içerik sözlüğünü kullan
 	const layoutContent = useIntlayer('layout');
 </script>

package/docs/vi/intlayer_cli.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-11
-updatedAt: 2025-01-27
+updatedAt: 2025-11-22
 title: CLI
 description: Khám phá cách sử dụng Intlayer CLI để quản lý trang web đa ngôn ngữ của bạn. Làm theo các bước trong tài liệu trực tuyến này để thiết lập dự án của bạn trong vài phút.
 keywords:
@@ -17,6 +17,9 @@ slugs:
   - concept
   - cli
 history:
+  - version: 7.2.3
+    date: 2025-11-22
+    changes: Thêm lệnh transform
   - version: 6.1.4
     date: 2025-01-27
     changes: Thêm bí danh cho các đối số và lệnh CLI
@@ -426,6 +429,39 @@ npx intlayer fill --file src/home/*.content.ts --source-locale en --output-local
 
 Lệnh này sẽ dịch nội dung từ tiếng Anh sang tiếng Pháp và tiếng Tây Ban Nha cho tất cả các file khai báo nội dung trong thư mục `src/home/` sử dụng mô hình GPT-3.5 Turbo.
 
+### Chuyển đổi thành phần
+
+```bash
+npx intlayer transform
+```
+
+Lệnh này phân tích các file mã của bạn để giúp di chuyển các thành phần hiện có sang sử dụng Intlayer. Nó hỗ trợ lựa chọn file tương tác hoặc nhắm mục tiêu file cụ thể.
+
+##### Bí danh:
+
+- `npx intlayer trans`
+
+##### Đối số:
+
+**Tùy chọn lựa chọn file:**
+
+- **`-f, --file [files...]`**: Danh sách các file cụ thể cần chuyển đổi. Nếu không được cung cấp, CLI sẽ quét các file khớp (`**/*.{tsx,jsx,vue,svelte,ts,js}`) và nhắc bạn chọn file nào cần chuyển đổi.
+
+  > Ví dụ: `npx intlayer transform -f src/components/MyComponent.tsx`
+
+**Tùy chọn đầu ra:**
+
+- **`-o, --output-content-declarations [outputContentDeclarations]`**: Thư mục để lưu các file khai báo nội dung đã tạo.
+
+  > Ví dụ: `npx intlayer transform -o src/content`
+
+**Tùy chọn cấu hình:**
+
+- **`--base-dir`**: Chỉ định thư mục cơ sở cho dự án.
+- **`--env`**: Chỉ định môi trường.
+- **`--env-file`**: Cung cấp file môi trường tùy chỉnh.
+- **`--verbose`**: Bật ghi log chi tiết.
+
 ### Kiểm tra bản dịch còn thiếu
 
 ```bash

package/docs/vi/intlayer_with_svelte_kit.md

@@ -42,6 +42,14 @@ Với Intlayer, bạn có thể:
 
 ## Hướng dẫn từng bước để thiết lập Intlayer trong ứng dụng SvelteKit
 
+<iframe
+  src="https://stackblitz.com/github/aymericzip/intlayer-sveltekit-template?embed=1&ctl=1&file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - Cách quốc tế hóa ứng dụng của bạn bằng Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
 Để bắt đầu, hãy tạo một dự án SvelteKit mới. Dưới đây là cấu trúc cuối cùng mà chúng ta sẽ tạo:
 
 ```bash
@@ -547,8 +555,9 @@ export const load: Load = ({ params }) => {
 	let { children, data }: { children: Snippet, data: LayoutData } = $props();
 
 	// Khởi tạo Intlayer với locale lấy từ route
-	setupIntlayer(data.locale);
-
+  $effect(() => {
+      setupIntlayer(data.locale);
+  });
 	// Sử dụng từ điển nội dung layout
 	const layoutContent = useIntlayer('layout');
 </script>

package/docs/zh/intlayer_cli.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2024-08-11
-updatedAt: 2025-07-11
+updatedAt: 2025-11-22
 title: CLI
 description: 了解如何使用 Intlayer CLI 来管理您的多语言网站。按照本在线文档中的步骤，几分钟内即可设置您的项目。
 keywords:
@@ -17,6 +17,9 @@ slugs:
   - concept
   - cli
 history:
+  - version: 7.2.3
+    date: 2025-11-22
+    changes: 添加 transform 命令
   - version: 5.5.11
     date: 2025-07-11
     changes: 更新 CLI 命令参数文档
@@ -310,6 +313,39 @@ npx intlayer fill --file src/home/*.content.ts --source-locale en --output-local
 
 此命令将使用 GPT-3.5 Turbo 模型，将 `src/home/` 目录下所有内容声明文件的内容从英语翻译成法语和西班牙语。
 
+### 转换组件
+
+```bash
+npx intlayer transform
+```
+
+此命令分析您的代码文件，以帮助将现有组件迁移到使用 Intlayer。它支持交互式文件选择或指定特定文件。
+
+##### 别名：
+
+- `npx intlayer trans`
+
+##### 参数：
+
+**文件选择选项：**
+
+- **`-f, --file [files...]`**: 要转换的特定文件列表。如果未提供，CLI 将扫描匹配的文件（`**/*.{tsx,jsx,vue,svelte,ts,js}`）并提示您选择要转换的文件。
+
+  > 示例: `npx intlayer transform -f src/components/MyComponent.tsx`
+
+**输出选项：**
+
+- **`-o, --output-content-declarations [outputContentDeclarations]`**: 保存生成的内容声明文件的目录。
+
+  > 示例: `npx intlayer transform -o src/content`
+
+**配置选项：**
+
+- **`--base-dir`**: 指定项目的基础目录。
+- **`--env`**: 指定环境。
+- **`--env-file`**: 提供自定义环境文件。
+- **`--verbose`**: 启用详细日志记录。
+
 ### 管理配置
 
 #### 获取配置

package/docs/zh/intlayer_with_svelte_kit.md

@@ -44,6 +44,14 @@ history:
 
 首先，创建一个新的 SvelteKit 项目。以下是我们将要构建的最终结构：
 
+<iframe
+  src="https://stackblitz.com/github/aymericzip/intlayer-sveltekit-template?embed=1&ctl=1&file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - Cách quốc tế hóa ứng dụng của bạn bằng Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
 ```bash
 .
 ├── intlayer.config.ts
@@ -547,8 +555,9 @@ export const load: Load = ({ params }) => {
 	let { children, data }: { children: Snippet, data: LayoutData } = $props();
 
 	// 使用路由中的 locale 初始化 Intlayer
-	setupIntlayer(data.locale);
-
+  $effect(() => {
+      setupIntlayer(data.locale);
+  });
 	// 使用布局内容字典
 	const layoutContent = useIntlayer('layout');
 </script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intlayer/docs",
-  "version": "7.2.0",
+  "version": "7.2.3",
   "private": false,
   "description": "Intlayer documentation",
   "keywords": [
@@ -72,23 +72,23 @@
     "watch": "webpack --config ./webpack.config.ts --watch"
   },
   "dependencies": {
-    "@intlayer/config": "7.2.0",
-    "@intlayer/core": "7.2.0",
-    "@intlayer/types": "7.2.0"
+    "@intlayer/config": "7.2.3",
+    "@intlayer/core": "7.2.3",
+    "@intlayer/types": "7.2.3"
   },
   "devDependencies": {
-    "@intlayer/api": "7.2.0",
-    "@intlayer/cli": "7.2.0",
+    "@intlayer/api": "7.2.3",
+    "@intlayer/cli": "7.2.3",
     "@types/node": "24.10.1",
     "@utils/ts-config": "1.0.4",
     "@utils/ts-config-types": "1.0.4",
     "@utils/tsdown-config": "1.0.4",
     "fast-glob": "3.3.3",
-    "rimraf": "6.1.0",
-    "tsdown": "0.16.5",
+    "rimraf": "6.1.2",
+    "tsdown": "0.16.6",
     "tsx": "^4.20.6",
     "typescript": "5.9.3",
-    "vitest": "4.0.10"
+    "vitest": "4.0.12"
   },
   "engines": {
     "node": ">=14.18"