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

package/docs/es/intlayer_with_vite+vue.md

@@ -1,6 +1,6 @@
 ---
 createdAt: 2025-04-18
-updatedAt: 2026-05-31
+updatedAt: 2026-06-23
 title: "Vite + Vue i18n - Guía completa para traducir tu aplicación"
 description: "Sin más i18next. La guía 2026 para crear una aplicación Vite + Vue multilingüe (i18n). Traduce con agentes de IA y optimiza el tamaño del bundle, SEO y rendimiento."
 keywords:
@@ -32,6 +32,10 @@ author: aymericzip
 
 # Traduce tu Vite y Vue con Intlayer | Internacionalización (i18n)
 
+## Tabla de Contenidos
+
+<TOC/>
+
 ## ¿Por qué Intlayer en lugar de alternativas?
 
 En comparación con soluciones principales como `vue-i18n` o `i18next`, Intlayer es una solución que viene con optimizaciones integradas como:
@@ -87,7 +91,7 @@ Más que una simple solución i18n, Intlayer proporciona un **[editor visual] au
 
 <Tabs defaultTab="video">
   <Tab label="Vídeo" value="video">
-  
+
 <iframe title="The best i18n solution for Vite y Vue? Discover Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/IE3XWkZ6a5U?autoplay=0&amp;origin=https://intlayer.org&amp;controls=0&amp;rel=1"/>
 
   </Tab>
@@ -123,28 +127,48 @@ Consulta la [Plantilla de Aplicación](https://github.com/aymericzip/intlayer-vi
 
 Instala los paquetes necesarios usando 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
+```
+
+> la bandera `--interactive` es opcional. Usa `intlayer-cli init` si eres un agente de IA.
+
+> Este comando detectará su entorno e instalará los paquetes necesarios. Por ejemplo:
+
 ```bash packageManager="npm"
 npm install intlayer vue-intlayer
 npm install vite-intlayer --save-dev
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer vue-intlayer
 pnpm add vite-intlayer --save-dev
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer vue-intlayer
 yarn add vite-intlayer --save-dev
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer vue-intlayer
 bun add vite-intlayer --dev
-bun x intlayer init
 ```
 
 - **intlayer**
@@ -645,14 +669,17 @@ Paralelamente, también puede usar el `intlayerProxy` para agregar enrutamiento
 ```typescript {3,7} fileName="vite.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
 import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
-import { intlayer, intlayerProxy } from "vite-intlayer";
+import { intlayer } from "vite-intlayer";
 
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
-    intlayerProxy(), // should be placed first
     vue(),
-    intlayer(),
+    intlayer({
+      proxy: {
+        ignore: (req) => req.url?.startsWith("/api"),
+      },
+    }),
   ],
 });
 ```
@@ -918,57 +945,7 @@ import RouterLink from "@components/RouterLink.vue";
 
 </Step>
 
-<Step number={11} title="Renderizar Markdown" isOptional={true}>
-
-Intlayer soporta la renderización de contenido Markdown directamente en tu aplicación Vue. Por defecto, Markdown se trata como texto plano. Para convertir Markdown en HTML enriquecido, puedes integrar [markdown-it](https://github.com/markdown-it/markdown-it), un parser de Markdown.
-
-Esto es particularmente útil cuando tus traducciones incluyen contenido formateado como listas, enlaces o énfasis.
-
-Por defecto, Intlayer renderiza markdown como cadena. Pero Intlayer también proporciona una forma de renderizar markdown en HTML usando la función `installIntlayerMarkdown`.
-
-> Para ver cómo declarar contenido markdown usando el paquete `intlayer`, consulta la [documentación de markdown](https://github.com/aymericzip/intlayer/tree/main/docs/es/dictionary/markdown.md).
-
-```ts fileName="main.ts"
-import MarkdownIt from "markdown-it";
-import { createApp, h } from "vue";
-import { installIntlayer, installIntlayerMarkdown } from "vue-intlayer";
-
-const app = createApp(App);
-
-app.use(intlayer);
-
-const md = new MarkdownIt({
-  html: true, // permitir etiquetas HTML
-  linkify: true, // auto-enlazar URLs
-  typographer: true, // habilitar comillas inteligentes, guiones, etc.
-});
-
-// Indicar a Intlayer que use md.render() cada vez que necesite convertir markdown en HTML
-installIntlayerMarkdown(app, (markdown) => {
-  const html = md.render(markdown);
-  return h("div", { innerHTML: html });
-});
-```
-
-Una vez registrado, puedes usar la sintaxis basada en componentes para mostrar el contenido Markdown directamente:
-
-```vue
-<template>
-  <div>
-    <myMarkdownContent />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useIntlayer } from "vue-intlayer";
-
-const { myMarkdownContent } = useIntlayer("my-component");
-</script>
-```
-
-</Step>
-
-<Step number={12} title="Extraer el contenido de tus componentes" isOptional={true}>
+<Step number={11} title="Extraer el contenido de tus componentes" isOptional={true}>
 
 Si tienes una base de código existente, transformar miles de archivos puede llevar mucho tiempo.
 
@@ -1031,6 +1008,8 @@ bun x intlayer extract
  </Tab>
  <Tab value='Compilador Babel'>
 
+> Since v9, the `intlayerCompiler` is included in the `intlayer` plugin. So you don't need to add it manually.
+
 Actualiza tu archivo `vite.config.ts` para incluir el plugin `intlayerCompiler` :
 
 ```ts fileName="vite.config.ts"
@@ -1040,7 +1019,7 @@ import { intlayer, intlayerCompiler } from "vite-intlayer";
 export default defineConfig({
   plugins: [
     intlayer(),
-    intlayerCompiler(), // Agrega el plugin del compilador
+    intlayerCompiler(), // Adds the compiler plugin
   ],
 });
 ```
@@ -1143,20 +1122,20 @@ Ajusta los comandos si usas pnpm o yarn. También puedes llamar al script desde
 
 ### Configurar TypeScript
 
-Intlayer utiliza la ampliación de módulos para aprovechar las ventajas de TypeScript y fortalecer tu base de código.
+Intlayer utiliza la ampliación de módulos para aprovechar las ventajas de TypeScript y fortalecer su base de código.
 
-![texto alternativo](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png)
+![Autocompletado](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
 
-![texto alternativo](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png)
+![Error de traducción](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
 
-Asegúrate de que tu configuración de TypeScript incluya los tipos autogenerados.
+Asegúrese de que su configuración de TypeScript incluya los tipos generados automáticamente.
 
 ```json5 fileName="tsconfig.json"
 {
-  // ... Tus configuraciones existentes de TypeScript
+  // ... Sus configuraciones existentes de TypeScript
   "include": [
     // ... Tus configuraciones existentes de TypeScript
-    ".intlayer/**/*.ts", // Incluir los tipos autogenerados
+    ".intlayer/**/*.ts", // Incluir los tipos generados automáticamente
   ],
 }
 ```
@@ -1167,50 +1146,28 @@ Se recomienda ignorar los archivos generados por Intlayer. Esto te permite evita
 
 Para hacerlo, puedes agregar las siguientes instrucciones a tu archivo `.gitignore`:
 
-```bash
-#  Ignorar los archivos generados por Intlayer
-.intlayer
-```
-
-### Extensión de VS Code
-
-Para mejorar tu experiencia de desarrollo con Intlayer, puedes instalar la **Extensión oficial de Intlayer para VS Code**.
-
-[Instalar desde el Marketplace de VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
-
-Esta extensión proporciona:
-
-- **Autocompletado** para las claves de traducción.
-- **Detección de errores en tiempo real** para traducciones faltantes.
-- **Previsualizaciones en línea** del contenido traducido.
-- **Acciones rápidas** para crear y actualizar traducciones fácilmente.
-
-Se recomienda ignorar los archivos generados por Intlayer. Esto te permite evitar comprometerlos en tu repositorio Git.
-
-Para hacer esto, puedes agregar las siguientes instrucciones a tu archivo `.gitignore`:
-
-```bash
-#  Ignorar los archivos generados por Intlayer
+```plaintext fileName=".gitignore"
+# Ignorar los archivos generados por Intlayer
 .intlayer
 ```
 
-### Extensión de VS Code
+### Extensión para VS Code
 
 Para mejorar tu experiencia de desarrollo con Intlayer, puedes instalar la **Extensión oficial de Intlayer para VS Code**.
 
 [Instalar desde el Marketplace de VS Code](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
 
-Esta extensión proporciona:
+Esta extensión ofrece:
 
 - **Autocompletado** para las claves de traducción.
 - **Detección de errores en tiempo real** para traducciones faltantes.
 - **Vistas previas en línea** del contenido traducido.
 - **Acciones rápidas** para crear y actualizar traducciones fácilmente.
 
-Para más detalles sobre cómo usar la extensión, consulta la [documentación de la Extensión de Intlayer para VS Code](https://intlayer.org/doc/vs-code-extension).
+Para más detalles sobre cómo usar la extensión, consulta la [documentación de la extensión Intlayer para VS Code](https://intlayer.org/doc/vs-code-extension).
 
 ---
 
-### Ir Más Allá
+### Ir más allá
 
 Para ir más allá, puedes implementar el [editor visual](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_visual_editor.md) o externalizar tu contenido usando el [CMS](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_CMS.md).

package/docs/es/live-sync.md

@@ -0,0 +1,176 @@
+---
+createdAt: 2026-07-08
+updatedAt: 2026-07-08
+title: Sincronización en vivo | Refleja los cambios de contenido del CMS en tiempo real
+description: Permite que tu aplicación refleje los cambios de contenido del CMS de Intlayer en tiempo de ejecución, sin necesidad de reconstruir ni volver a implementar.
+keywords:
+  - Sincronización en vivo
+  - Live Sync
+  - CMS
+  - Editor Visual
+  - Internacionalización
+  - Documentación
+  - Intlayer
+  - Next.js
+  - Vite
+history:
+  - version: 9.0.0
+    date: 2026-07-08
+    changes: "Trasladado desde la documentación del CMS de Intlayer a su propia página"
+  - version: 6.0.1
+    date: 2025-09-22
+    changes: "Añadida documentación de sincronización en vivo"
+  - version: 6.0.0
+    date: 2025-09-04
+    changes: "Reemplazado el campo `hotReload` por `liveSync`"
+author: aymericzip
+---
+
+# Sincronización en vivo
+
+La sincronización en vivo permite que tu aplicación refleje los cambios de contenido del CMS en runtime. No se requiere reconstrucción ni redepliegue. Cuando está habilitada, las actualizaciones se transmiten a un servidor de sincronización en vivo que actualiza los diccionarios que tu aplicación lee.
+
+## Tabla de contenidos
+
+<TOC/>
+
+---
+
+## Activar la sincronización en vivo
+
+> Live Sync requiere una conexión continua al servidor y está disponible en el plan enterprise.
+
+Habilita Live Sync actualizando tu configuración de Intlayer:
+
+```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import type { IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  // ... otras configuraciones
+  editor: {
+    /**
+     * Habilita la recarga en caliente de las configuraciones de localización cuando se detectan cambios.
+     * Por ejemplo, cuando se añade o actualiza un diccionario, la aplicación actualiza
+     * el contenido mostrado en la página.
+     *
+     * Debido a que la recarga en caliente requiere una conexión continua al servidor,
+     * solo está disponible para clientes del plan `enterprise`.
+     *
+     * Por defecto: false
+     */
+    liveSync: true,
+  },
+  dictionary: {
+    /**
+     * Controla cómo se importan los diccionarios:
+     *
+     * - "live": Los diccionarios se obtienen dinámicamente usando la API de Live Sync.
+     *   Reemplaza useIntlayer por useDictionaryDynamic.
+     *
+     * Nota: El modo live usa la API de Live Sync para obtener los diccionarios. Si la llamada a la API
+     * falla, los diccionarios se importan dinámicamente.
+     * Nota: Solo los diccionarios con contenido remoto y la bandera "live" usan el modo live.
+     * Los demás usan el modo dinámico para mejorar el rendimiento.
+     */
+    importMode: "fetch",
+  },
+};
+
+export default config;
+```
+
+Inicie el servidor Live Sync para envolver su aplicación:
+
+Ejemplo usando Next.js:
+
+```json5 fileName="package.json"
+{
+  "scripts": {
+    // ... otros scripts
+    "build": "next build",
+    "dev": "next dev",
+    "start": "npx intlayer live --with 'next start'",
+  },
+}
+```
+
+Ejemplo usando Vite:
+
+```json5 fileName="package.json"
+{
+  "scripts": {
+    // ... otros scripts
+    "build": "vite build",
+    "dev": "vite dev",
+    "start": "npx intlayer live --with 'vite start'",
+  },
+}
+```
+
+El servidor Live Sync envuelve su aplicación y aplica automáticamente el contenido actualizado a medida que llega.
+
+Para recibir notificaciones de cambios desde el CMS, el servidor Live Sync mantiene una conexión SSE con el backend. Cuando el contenido cambia en el CMS, el backend envía la actualización al servidor Live Sync, que escribe los nuevos diccionarios. Su aplicación reflejará la actualización en la siguiente navegación o recarga del navegador, sin necesidad de reconstrucción.
+
+Diagrama de flujo (CMS/Backend -> Servidor Live Sync -> Servidor de Aplicación -> Frontend):
+
+![Esquema de lógica de Live Sync](https://github.com/aymericzip/intlayer/blob/main/docs/assets/live_sync_logic_schema.svg)
+
+Cómo funciona:
+
+![Esquema de flujo Live Sync CMS/Backend/Servidor Live Sync/Servidor de Aplicación/Frontend](https://github.com/aymericzip/intlayer/blob/main/docs/assets/live_sync_flow_scema.svg)
+
+## Flujo de trabajo de desarrollo (local)
+
+docs/ko/intlayer_CMS.md
+
+- En desarrollo, todos los diccionarios remotos se obtienen cuando la aplicación se inicia, para que puedas probar actualizaciones rápidamente.
+- Para probar Live Sync localmente con Next.js, envuelve tu servidor de desarrollo:
+
+```json5 fileName="package.json"
+{
+  "scripts": {
+    // ... otros scripts
+    "dev": "npx intlayer live --with 'next dev'",
+    // "dev": "npx intlayer live --with 'vite dev'", // Para Vite
+  },
+}
+```
+
+Habilita la optimización para que Intlayer aplique las transformaciones de importación en vivo durante el desarrollo:
+
+```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import type { IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  editor: {
+    applicationURL: "http://localhost:5173",
+    liveSyncURL: "http://localhost:4000",
+    liveSync: true,
+  },
+  dictionary: {
+    importMode: "fetch",
+  },
+  build: {
+    optimize: true,
+  },
+};
+
+export default config;
+```
+
+Esta configuración envuelve tu servidor de desarrollo con el servidor Live Sync, obtiene los diccionarios remotos al iniciar y transmite actualizaciones desde el CMS vía SSE. Actualiza la página para ver los cambios.
+
+## Notas y restricciones
+
+- Añade el origen de live sync a la política de seguridad de tu sitio (CSP). Asegúrate de que la URL de live sync esté permitida en `connect-src` (y en `frame-ancestors` si es relevante).
+- Live Sync no funciona con salida estática. Para Next.js, la página debe ser dinámica para recibir actualizaciones en runtime (por ejemplo, usa `generateStaticParams`, `generateMetadata`, `getServerSideProps` o `getStaticProps` adecuadamente para evitar restricciones de solo estático).
+- En el CMS, cada diccionario tiene una bandera `live`. Solo los diccionarios con `live=true` se obtienen a través de la API de live sync; los demás se importan dinámicamente y permanecen sin cambios en tiempo de ejecución.
+- La bandera `live` se evalúa para cada diccionario en el momento de la compilación. Si el contenido remoto no estaba marcado como `live=true` durante la compilación, debes recompilar para habilitar Live Sync para ese diccionario.
+- El servidor de live sync debe poder escribir en `.intlayer`. En contenedores, asegura el acceso de escritura a `/.intlayer`.
+
+## Enlaces útiles
+
+- [CMS de Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_CMS.md)
+- [Editor Visual de Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_visual_editor.md)
+- [Referencia de configuración](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/configuration.md)
+- [Guía de Auto-alojamiento](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/self_hosting.md)

package/docs/es/migration_from_i18next_to_intlayer.md

@@ -98,24 +98,44 @@ Los siguientes pasos son el mínimo requerido para que tu aplicación `i18next`
 
 Instala los paquetes principales de Intlayer y el adaptador de compatibilidad:
 
+```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
+```
+
+> la bandera `--interactive` es opcional. Usa `intlayer-cli init` si eres un agente de IA.
+
+> Este comando detectará su entorno e instalará los paquetes necesarios. Por ejemplo:
+
 ```bash packageManager="npm"
 npm install intlayer @intlayer/i18next @intlayer/sync-json-plugin
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer @intlayer/i18next @intlayer/sync-json-plugin
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer @intlayer/i18next @intlayer/sync-json-plugin
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/i18next @intlayer/sync-json-plugin
-bun x intlayer init
 ```
 
 > Puedes mantener `i18next` instalado — el adaptador de compatibilidad lo usa como `devDependency` / `peerDependency` para los tipos de TypeScript.

package/docs/es/migration_from_next-i18next_to_intlayer.md

@@ -101,24 +101,44 @@ Los siguientes pasos son el mínimo requerido para que tu aplicación Next.js Pa
 
 Instala los paquetes principales de Intlayer y los adaptadores de compatibilidad:
 
+```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
+```
+
+> la bandera `--interactive` es opcional. Usa `intlayer-cli init` si eres un agente de IA.
+
+> Este comando detectará su entorno e instalará los paquetes necesarios. Por ejemplo:
+
 ```bash packageManager="npm"
 npm install intlayer next-intlayer react-intlayer @intlayer/next-i18next @intlayer/react-i18next @intlayer/i18next @intlayer/sync-json-plugin
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer next-intlayer react-intlayer @intlayer/next-i18next @intlayer/react-i18next @intlayer/i18next @intlayer/sync-json-plugin
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer next-intlayer react-intlayer @intlayer/next-i18next @intlayer/react-i18next @intlayer/i18next @intlayer/sync-json-plugin
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer react-intlayer @intlayer/next-i18next @intlayer/react-i18next @intlayer/i18next @intlayer/sync-json-plugin
-bun x intlayer init
 ```
 
 > Puedes mantener de manera segura `next-i18next`, `react-i18next`, e `i18next` instalados durante la migración, aunque los eliminarás una vez configurados los alias.

package/docs/es/migration_from_next-intl_to_intlayer.md

@@ -97,24 +97,44 @@ Los siguientes pasos son el mínimo requerido para que tu aplicación `next-intl
 
 Instala los paquetes principales de Intlayer y el adaptador de compatibilidad `@intlayer/next-intl`:
 
+```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
+```
+
+> la bandera `--interactive` es opcional. Usa `intlayer-cli init` si eres un agente de IA.
+
+> Este comando detectará su entorno e instalará los paquetes necesarios. Por ejemplo:
+
 ```bash packageManager="npm"
 npm install intlayer next-intlayer @intlayer/next-intl @intlayer/sync-json-plugin
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer next-intlayer @intlayer/next-intl @intlayer/sync-json-plugin
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer next-intlayer @intlayer/next-intl @intlayer/sync-json-plugin
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer next-intlayer @intlayer/next-intl @intlayer/sync-json-plugin
-bun x intlayer init
 ```
 
 > Conserva instalado `next-intl` — sigue siendo necesario para el **enrutamiento URL** (`createNavigation`, `createMiddleware`, `Link`, `redirect`, `usePathname`, `useRouter`). El adaptador de compatibilidad **no** reemplaza la capa de enrutamiento.
@@ -168,9 +188,7 @@ import { createNextIntlPlugin } from "@intlayer/next-intl/plugin";
 
 const withIntlayer = createNextIntlPlugin();
 
-const nextConfig: NextConfig = {
-  /* tus opciones de configuración existentes */
-};
+const nextConfig: NextConfig = {/* tus opciones de configuración existentes */};
 
 export default withIntlayer(nextConfig);
 ```

package/docs/es/migration_from_nuxtjs_i18n_to_intlayer.md

@@ -100,24 +100,44 @@ Los siguientes pasos son el mínimo requerido para que tu aplicación Nuxt exist
 
 Instala los paquetes principales de Intlayer y el adaptador de compatibilidad:
 
+```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
+```
+
+> la bandera `--interactive` es opcional. Usa `intlayer-cli init` si eres un agente de IA.
+
+> Este comando detectará su entorno e instalará los paquetes necesarios. Por ejemplo:
+
 ```bash packageManager="npm"
 npm install intlayer vue-intlayer nuxt-intlayer @intlayer/vue-i18n @intlayer/sync-json-plugin
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer vue-intlayer nuxt-intlayer @intlayer/vue-i18n @intlayer/sync-json-plugin
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer vue-intlayer nuxt-intlayer @intlayer/vue-i18n @intlayer/sync-json-plugin
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer vue-intlayer nuxt-intlayer @intlayer/vue-i18n @intlayer/sync-json-plugin
-bun x intlayer init
 ```
 
 > Puedes mantener de forma segura `@nuxtjs/i18n` instalado durante la migración, aunque en breve lo eliminarás de tu configuración de Nuxt.