@intlayer/docs 6.0.1 → 6.0.2-canary.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/blog.cjs.map +1 -1
- package/dist/cjs/common.cjs +6 -5
- package/dist/cjs/common.cjs.map +1 -1
- package/dist/cjs/generated/blog.entry.cjs +318 -1863
- package/dist/cjs/generated/blog.entry.cjs.map +1 -1
- package/dist/cjs/generated/docs.entry.cjs +1317 -6282
- package/dist/cjs/generated/docs.entry.cjs.map +1 -1
- package/dist/cjs/generated/frequentQuestions.entry.cjs +197 -1182
- package/dist/cjs/generated/frequentQuestions.entry.cjs.map +1 -1
- package/dist/cjs/generated/legal.entry.cjs +43 -84
- package/dist/cjs/generated/legal.entry.cjs.map +1 -1
- package/dist/esm/blog.mjs.map +1 -1
- package/dist/esm/common.mjs +2 -5
- package/dist/esm/common.mjs.map +1 -1
- package/dist/esm/generated/blog.entry.mjs +318 -1863
- package/dist/esm/generated/blog.entry.mjs.map +1 -1
- package/dist/esm/generated/docs.entry.mjs +1317 -6282
- package/dist/esm/generated/docs.entry.mjs.map +1 -1
- package/dist/esm/generated/frequentQuestions.entry.mjs +197 -1182
- package/dist/esm/generated/frequentQuestions.entry.mjs.map +1 -1
- package/dist/esm/generated/legal.entry.mjs +43 -84
- package/dist/esm/generated/legal.entry.mjs.map +1 -1
- package/dist/types/blog.d.ts +1 -1
- package/dist/types/blog.d.ts.map +1 -1
- package/dist/types/common.d.ts +1 -1
- package/dist/types/common.d.ts.map +1 -1
- package/dist/types/generated/blog.entry.d.ts +1 -1
- package/dist/types/generated/blog.entry.d.ts.map +1 -1
- package/dist/types/generated/docs.entry.d.ts +2 -1
- package/dist/types/generated/docs.entry.d.ts.map +1 -1
- package/dist/types/generated/frequentQuestions.entry.d.ts +1 -1
- package/dist/types/generated/frequentQuestions.entry.d.ts.map +1 -1
- package/dist/types/generated/legal.entry.d.ts +1 -1
- package/dist/types/generated/legal.entry.d.ts.map +1 -1
- package/docs/ar/intlayer_CMS.md +261 -85
- package/docs/ar/releases/v6.md +273 -0
- package/docs/ar/roadmap.md +1 -3
- package/docs/ar/vs_code_extension.md +94 -63
- package/docs/de/intlayer_CMS.md +247 -65
- package/docs/de/releases/v6.md +298 -0
- package/docs/de/roadmap.md +1 -3
- package/docs/de/vs_code_extension.md +89 -58
- package/docs/en/configuration.md +9 -2
- package/docs/en/intlayer_CMS.md +205 -23
- package/docs/en/intlayer_cli.md +4 -4
- package/docs/en/intlayer_visual_editor.md +7 -6
- package/docs/en/intlayer_with_nextjs_14.md +17 -1
- package/docs/en/intlayer_with_nextjs_15.md +17 -1
- package/docs/en/releases/v6.md +268 -0
- package/docs/en/roadmap.md +1 -3
- package/docs/en/vs_code_extension.md +79 -49
- package/docs/en-GB/intlayer_CMS.md +216 -52
- package/docs/en-GB/releases/v6.md +297 -0
- package/docs/en-GB/roadmap.md +1 -3
- package/docs/en-GB/vs_code_extension.md +79 -48
- package/docs/es/intlayer_CMS.md +257 -84
- package/docs/es/releases/v6.md +274 -0
- package/docs/es/roadmap.md +1 -3
- package/docs/es/vs_code_extension.md +90 -60
- package/docs/fr/intlayer_CMS.md +250 -68
- package/docs/fr/releases/v6.md +274 -0
- package/docs/fr/roadmap.md +1 -3
- package/docs/fr/vs_code_extension.md +94 -63
- package/docs/hi/intlayer_CMS.md +253 -77
- package/docs/hi/releases/v6.md +273 -0
- package/docs/hi/roadmap.md +1 -3
- package/docs/hi/vs_code_extension.md +92 -61
- package/docs/it/intlayer_CMS.md +251 -73
- package/docs/it/releases/v6.md +273 -0
- package/docs/it/roadmap.md +1 -3
- package/docs/it/vs_code_extension.md +94 -63
- package/docs/ja/intlayer_CMS.md +282 -97
- package/docs/ja/releases/v6.md +273 -0
- package/docs/ja/roadmap.md +1 -3
- package/docs/ja/vs_code_extension.md +99 -68
- package/docs/ko/intlayer_CMS.md +267 -93
- package/docs/ko/releases/v6.md +273 -0
- package/docs/ko/roadmap.md +1 -3
- package/docs/ko/vs_code_extension.md +88 -57
- package/docs/pt/intlayer_CMS.md +261 -83
- package/docs/pt/releases/v6.md +273 -0
- package/docs/pt/roadmap.md +1 -3
- package/docs/pt/vs_code_extension.md +89 -58
- package/docs/ru/intlayer_CMS.md +240 -65
- package/docs/ru/releases/v6.md +274 -0
- package/docs/ru/roadmap.md +1 -1
- package/docs/ru/vs_code_extension.md +83 -52
- package/docs/tr/intlayer_CMS.md +278 -96
- package/docs/tr/intlayer_with_nextjs_page_router.md +1 -1
- package/docs/tr/intlayer_with_tanstack.md +3 -0
- package/docs/tr/releases/v6.md +273 -0
- package/docs/tr/roadmap.md +1 -1
- package/docs/tr/vs_code_extension.md +100 -71
- package/docs/zh/intlayer_CMS.md +257 -76
- package/docs/zh/releases/v6.md +273 -0
- package/docs/zh/roadmap.md +1 -3
- package/docs/zh/vs_code_extension.md +99 -68
- package/package.json +9 -8
- package/src/blog.ts +1 -1
- package/src/common.ts +2 -6
- package/src/generated/blog.entry.ts +323 -1864
- package/src/generated/docs.entry.ts +1317 -6278
- package/src/generated/frequentQuestions.entry.ts +202 -1183
- package/src/generated/legal.entry.ts +48 -85
|
@@ -0,0 +1,274 @@
|
|
|
1
|
+
---
|
|
2
|
+
createdAt: 2025-09-22
|
|
3
|
+
updatedAt: 2025-09-22
|
|
4
|
+
title: Nueva versión Intlayer v6 - ¿Qué hay de nuevo?
|
|
5
|
+
description: Descubre las novedades de Intlayer v6. Grandes mejoras en rendimiento, experiencia del desarrollador y nuevas funcionalidades para mejorar tu flujo de trabajo de internacionalización.
|
|
6
|
+
keywords:
|
|
7
|
+
- Intlayer
|
|
8
|
+
- Localización
|
|
9
|
+
- Desarrollo
|
|
10
|
+
- Rendimiento
|
|
11
|
+
- Experiencia del desarrollador
|
|
12
|
+
- Funcionalidades
|
|
13
|
+
- React
|
|
14
|
+
- Next.js
|
|
15
|
+
- JavaScript
|
|
16
|
+
- TypeScript
|
|
17
|
+
slugs:
|
|
18
|
+
- doc
|
|
19
|
+
- releases
|
|
20
|
+
- v6
|
|
21
|
+
---
|
|
22
|
+
|
|
23
|
+
# Nueva versión Intlayer v6 - ¿Qué hay de nuevo?
|
|
24
|
+
|
|
25
|
+
¡Bienvenido a Intlayer v6! Esta versión se centra en el rendimiento, la experiencia del desarrollador y la fiabilidad. A continuación, los aspectos más destacados, con notas de migración y ejemplos para copiar y pegar.
|
|
26
|
+
|
|
27
|
+
## Aspectos destacados
|
|
28
|
+
|
|
29
|
+
- Nuevo comando: `npx intlayer content test` para detectar traducciones faltantes
|
|
30
|
+
- Nueva opción global `autoFill` para autogenerar traducciones faltantes
|
|
31
|
+
- El comando Fill por defecto omite las traducciones existentes: `npx intlayer fill`
|
|
32
|
+
- Extensión de VS Code: nueva Barra de Actividad de Intlayer (Búsqueda y Diccionarios), acciones en la barra de herramientas/contexto, auto-revelado, comandos Fill/Test
|
|
33
|
+
- Construcciones 10× más rápidas gracias a la paralelización de promesas
|
|
34
|
+
- Caché remota de diccionarios para evitar recargas al iniciar la aplicación
|
|
35
|
+
- Registro mejorado: configura `log.mode: 'verbose'` para inspeccionar el comportamiento
|
|
36
|
+
- Validación más estricta para evitar fallos en la aplicación por problemas en los diccionarios
|
|
37
|
+
- Actualizaciones en vivo con CMS usando `build.importMode = 'live'` y `pnpm intlayer live`
|
|
38
|
+
- Correcciones: integración con Vue.js, adaptador Lynx, Editor Visual en Windows
|
|
39
|
+
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## Nuevo: Prueba de traducciones faltantes
|
|
43
|
+
|
|
44
|
+
Audita rápidamente tu proyecto para encontrar qué claves/idiomas faltan.
|
|
45
|
+
|
|
46
|
+
```bash
|
|
47
|
+
npx intlayer content test
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Salida:
|
|
51
|
+
|
|
52
|
+
```bash
|
|
53
|
+
pnpm intlayer content test
|
|
54
|
+
Traducciones faltantes:
|
|
55
|
+
- blog-data - Japonés (ja), Coreano (ko), Chino (zh), Alemán (de), Italiano (it) - src/components/BlogPage/blogData.content.ts
|
|
56
|
+
- demo-page - Francés (fr), Italiano (it) - src/components/DemoPage/demo.content.ts
|
|
57
|
+
- locale-switcher - Italiano (it), Portugués (pt) - src/components/LocaleSwitcher/localeSwitcher.content.ts
|
|
58
|
+
Locales: Inglés (en), Ruso (ru), Japonés (ja), Francés (fr), Coreano (ko), Chino (zh), Español (es), Alemán (de), Árabe (ar), Italiano (it), Inglés Británico (en-GB), Portugués (pt), Hindi (hi)
|
|
59
|
+
Locales requeridas: Inglés (en)
|
|
60
|
+
Locales faltantes: Japonés (ja), Coreano (ko), Chino (zh), Alemán (de), Italiano (it), Francés (fr), Portugués (pt)
|
|
61
|
+
Locales requeridas faltantes: -
|
|
62
|
+
Total de locales faltantes: 7
|
|
63
|
+
Total de locales requeridas faltantes: 0
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
Consulta más opciones en la documentación de la CLI: [Referencia CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_cli.md) → "Test missing translations". Así como la guía de [Testing](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/testing.md).
|
|
67
|
+
|
|
68
|
+
---
|
|
69
|
+
|
|
70
|
+
## Nuevo: autoFill global para completar traducciones faltantes
|
|
71
|
+
|
|
72
|
+
Ahora puedes habilitar auto‑fill globalmente para que cualquier diccionario con traducciones faltantes se complete automáticamente.
|
|
73
|
+
|
|
74
|
+
```ts fileName="intlayer.config.ts"
|
|
75
|
+
import { type IntlayerConfig, Locales } from "intlayer";
|
|
76
|
+
|
|
77
|
+
const config: IntlayerConfig = {
|
|
78
|
+
internationalization: {
|
|
79
|
+
locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
|
|
80
|
+
defaultLocale: Locales.ENGLISH,
|
|
81
|
+
requiredLocales: [Locales.ENGLISH, Locales.FRENCH],
|
|
82
|
+
},
|
|
83
|
+
content: {
|
|
84
|
+
// Auto-generar traducciones faltantes para todos los diccionarios
|
|
85
|
+
autoFill: "./{{fileName}}.content.ts",
|
|
86
|
+
//
|
|
87
|
+
// autoFill: "/messages/{{locale}}/{{key}}/{{fileName}}.content.json",
|
|
88
|
+
//
|
|
89
|
+
// autoFill: true, // auto-generar traducciones faltantes para todos los diccionarios como usando "./{{fileName}}.content.json"
|
|
90
|
+
//
|
|
91
|
+
// autoFill: {
|
|
92
|
+
// en: "./{{fileName}}.en.content.json",
|
|
93
|
+
// fr: "./{{fileName}}.fr.content.json",
|
|
94
|
+
// es: "./{{fileName}}.es.content.json",
|
|
95
|
+
// },
|
|
96
|
+
},
|
|
97
|
+
};
|
|
98
|
+
|
|
99
|
+
export default config;
|
|
100
|
+
```
|
|
101
|
+
|
|
102
|
+
Aún puedes ajustar por diccionario usando el campo `autoFill` en los archivos de contenido. Consulta la referencia completa en `doc/autoFill` y `doc/dictionary/content_file`.
|
|
103
|
+
|
|
104
|
+
---
|
|
105
|
+
|
|
106
|
+
## Comando fill: valores predeterminados más seguros
|
|
107
|
+
|
|
108
|
+
El comando fill ahora, por defecto, solo rellena las traducciones faltantes y omite el contenido existente.
|
|
109
|
+
|
|
110
|
+
```bash
|
|
111
|
+
npx intlayer fill
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
```bash
|
|
115
|
+
Claves de diccionario afectadas para el procesamiento: access-key-creation-form-schema, doc-search-metadata, doc-search-page
|
|
116
|
+
- [access-key-creation-form-schema] El diccionario no tiene ruta de archivo. Omitiendo.
|
|
117
|
+
- [access-key-creation-form-schema] Procesando declaración de contenido: src/components/Dashboard/ProjectForm/AccessKey/useAccessKeyCreationFormSchema.content.ts
|
|
118
|
+
- [access-key-creation-form-schema] No hay locales para rellenar - Omitiendo diccionario
|
|
119
|
+
- [doc-search-metadata] El diccionario no tiene ruta de archivo. Omitiendo.
|
|
120
|
+
- [doc-search-metadata] Procesando declaración de contenido: src/app/[locale]/(docs)/doc/search/metadata.content.ts
|
|
121
|
+
- [doc-search-metadata] No hay locales para rellenar - Omitiendo diccionario
|
|
122
|
+
- [doc-search-page] El diccionario no tiene ruta de archivo. Omitiendo.
|
|
123
|
+
- [doc-search-page] Procesando declaración de contenido: src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
124
|
+
- [doc-search-page] [Ruso (ru)] Preparando traducción para el diccionario de Inglés (en) a Ruso (ru)
|
|
125
|
+
[intlayer] Se aplicó el formato Prettier a src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
126
|
+
- [doc-search-page] Declaración de contenido escrita en src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
Ejemplos de CI están disponibles en [CI/CD](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/CI_CD.md).
|
|
130
|
+
|
|
131
|
+
---
|
|
132
|
+
|
|
133
|
+
## Extensión actualizada de VS Code
|
|
134
|
+
|
|
135
|
+
La extensión ahora incluye una pestaña dedicada de Intlayer en la Barra de Actividad y varias mejoras en el flujo de trabajo:
|
|
136
|
+
|
|
137
|
+
- Barra de Actividad de Intlayer con dos vistas:
|
|
138
|
+
- Vista web de búsqueda (`intlayer.searchBar`) para búsqueda en vivo en diccionarios/contenidos
|
|
139
|
+
- Árbol de diccionarios (`intlayer.dictionaries`) que lista entornos, diccionarios y archivos contribuyentes
|
|
140
|
+
- Barra de herramientas en la vista de Diccionarios: Construir, Extraer (Pull), Enviar (Push), Rellenar, Actualizar, Probar, Crear archivo de diccionario
|
|
141
|
+
- Menús contextuales: Extraer/Enviar en diccionarios; Rellenar en archivos
|
|
142
|
+
|
|
143
|
+
- Auto-revelación: el archivo actual del editor se resalta en el árbol de Diccionarios cuando es aplicable
|
|
144
|
+
- Nuevos comandos disponibles desde la Paleta de Comandos: Rellenar Diccionarios y Probar Diccionarios
|
|
145
|
+
|
|
146
|
+
Vea los detalles en la documentación de la [Extensión Oficial de VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/vs_code_extension.md).
|
|
147
|
+
|
|
148
|
+
---
|
|
149
|
+
|
|
150
|
+
## Rendimiento: 10× más rápido
|
|
151
|
+
|
|
152
|
+
- Resolución paralela de diccionarios locales y remotos
|
|
153
|
+
- Los diccionarios remotos se almacenan en caché para evitar volver a obtenerlos al iniciar la aplicación
|
|
154
|
+
|
|
155
|
+
```bash
|
|
156
|
+
npx intlayer build
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
Salida:
|
|
160
|
+
|
|
161
|
+
```bash
|
|
162
|
+
[intlayer] Preparando Intlayer (v6.0.1)
|
|
163
|
+
[intlayer] Diccionarios:
|
|
164
|
+
[intlayer] ✓ Contenido local: 163/163
|
|
165
|
+
[intlayer] ✓ Contenido remoto: 100/100
|
|
166
|
+
[intlayer] - access-key-creation-form [local: ✔ construido] [distant: ✔ importado]
|
|
167
|
+
[intlayer] - access-key-creation-form-schema [local: ✔ construido] [distant: ✔ importado]
|
|
168
|
+
[intlayer] - access-key-form [local: ✔ construido] [distant: ✔ importado]
|
|
169
|
+
[intlayer] - ai-ab-testing-section [distant: ✔ importado]
|
|
170
|
+
[intlayer] - application-not-running-view [local: ✔ construido] [distant: ✔ importado]
|
|
171
|
+
[intlayer] - application-template-message [local: ✔ construido] [distant: ✔ obtenido]
|
|
172
|
+
[intlayer] - aside-navigation [local: ✔ construido] [distant: ✔ importado]
|
|
173
|
+
[intlayer] - ask-reset-password [local: ✔ construido] [distant: ✔ importado]
|
|
174
|
+
[intlayer] - ask-reset-password-schema [local: ✔ construido] [distant: ✔ importado]
|
|
175
|
+
[intlayer] - sección-autocompletado [local: ✔ construido] [distant: ✔ obtenido]
|
|
176
|
+
[intlayer] - sección-tecnología-disponible [local: ✔ construido] [distant: ✔ importado]
|
|
177
|
+
[intlayer] - datos-blog [local: ✔ construido]
|
|
178
|
+
[intlayer] - metadatos-blog [local: ✔ construido]
|
|
179
|
+
[intlayer] - lista-navegación-blog [local: ✔ construido] [distant: ✔ importado]
|
|
180
|
+
[intlayer] - página-blog [distant: ✔ obtenido]
|
|
181
|
+
[intlayer] - metadatos-búsqueda-blog [local: ✔ construido] [distant: ✔ importado]
|
|
182
|
+
[intlayer] - página-búsqueda-blog [local: ✔ construido] [distant: ✔ importado]
|
|
183
|
+
...
|
|
184
|
+
[intlayer] Contenido cargado (Total: 8401ms - Local: 4050ms - Remoto: 4222ms)
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
---
|
|
188
|
+
|
|
189
|
+
## Mejoras en el registro de eventos (Logging)
|
|
190
|
+
|
|
191
|
+
El sistema de registro se ha mejorado para proporcionar información más detallada sobre lo que sucede durante las transformaciones en tiempo de compilación y ejecución.
|
|
192
|
+
|
|
193
|
+
> Habilite los registros detallados para comprender mejor lo que sucede durante las transformaciones en tiempo de compilación y ejecución.
|
|
194
|
+
|
|
195
|
+
```ts fileName="intlayer.config.ts"
|
|
196
|
+
export default {
|
|
197
|
+
log: {
|
|
198
|
+
mode: "verbose", // opciones: "default" | "verbose" | "disabled"
|
|
199
|
+
},
|
|
200
|
+
};
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
Consulte [Configuración](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/configuration.md) para todas las opciones de registro.
|
|
204
|
+
|
|
205
|
+
---
|
|
206
|
+
|
|
207
|
+
## Validación más estricta
|
|
208
|
+
|
|
209
|
+
El procesamiento del diccionario ahora realiza una validación más robusta. Cuando un diccionario no se puede procesar, Intlayer evita que su aplicación se rompa y muestra errores accionables.
|
|
210
|
+
|
|
211
|
+
---
|
|
212
|
+
|
|
213
|
+
## Actualizaciones en vivo con CMS (Seguro para producción)
|
|
214
|
+
|
|
215
|
+
Sirve actualizaciones de contenido en vivo (por ejemplo, actualizaciones editoriales) en producción sin necesidad de reconstruir tu aplicación.
|
|
216
|
+
|
|
217
|
+
1. Habilita el modo de importación en vivo:
|
|
218
|
+
|
|
219
|
+
```ts fileName="intlayer.config.ts"
|
|
220
|
+
import { type IntlayerConfig } from "intlayer";
|
|
221
|
+
|
|
222
|
+
const config: IntlayerConfig = {
|
|
223
|
+
build: {
|
|
224
|
+
importMode: "live", // "static" | "dynamic" | "live"
|
|
225
|
+
},
|
|
226
|
+
editor: {
|
|
227
|
+
liveSync: true, // habilitar sincronización en vivo del lado del servidor
|
|
228
|
+
},
|
|
229
|
+
};
|
|
230
|
+
|
|
231
|
+
export default config;
|
|
232
|
+
```
|
|
233
|
+
|
|
234
|
+
2. Ejecuta tu aplicación y el proceso en vivo simultáneamente:
|
|
235
|
+
|
|
236
|
+
```bash
|
|
237
|
+
npx intlayer live --process 'vite preview'
|
|
238
|
+
```
|
|
239
|
+
|
|
240
|
+
Notas:
|
|
241
|
+
|
|
242
|
+
- Solo los diccionarios marcados para usar el modo en vivo serán obtenidos en vivo. Los demás están optimizados para rendimiento.
|
|
243
|
+
- Se recurre a la importación dinámica si la API en vivo no está disponible.
|
|
244
|
+
|
|
245
|
+
Consulta [CMS y sincronización en vivo](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_CMS.md) y [Configuración](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/configuration.md) para obtener una guía completa.
|
|
246
|
+
|
|
247
|
+
---
|
|
248
|
+
|
|
249
|
+
## Notas de migración
|
|
250
|
+
|
|
251
|
+
- Eliminado: `dictionaryOutput` (anteriormente `i18next` o `next-intl`). Esto volverá como adaptadores enchufables en versiones futuras. Elimina este campo de tu configuración.
|
|
252
|
+
- Eliminación relacionada: `i18nextResourcesDir` (consulta el registro de cambios en `doc/configuration`).
|
|
253
|
+
- Prefiere la nueva opción global `content.autoFill` para generar traducciones faltantes a gran escala.
|
|
254
|
+
- Usa `npx intlayer content test` para controlar los PRs con traducciones faltantes.
|
|
255
|
+
- Para diagnósticos detallados, configura `log.mode = 'verbose'`.
|
|
256
|
+
|
|
257
|
+
---
|
|
258
|
+
|
|
259
|
+
## Correcciones
|
|
260
|
+
|
|
261
|
+
- Estabilidad en la integración con Vue.js
|
|
262
|
+
- Mejoras en el adaptador Lynx
|
|
263
|
+
- Editor visual en Windows
|
|
264
|
+
|
|
265
|
+
---
|
|
266
|
+
|
|
267
|
+
## Enlaces útiles
|
|
268
|
+
|
|
269
|
+
- [Referencia CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_cli.md)
|
|
270
|
+
- [Auto‑relleno](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/autoFill.md)
|
|
271
|
+
- [Configuración](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/configuration.md)
|
|
272
|
+
- [Referencia de archivo de contenido](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/dictionary/content_file.md)
|
|
273
|
+
- [Extensión oficial para VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/vs_code_extension.md)
|
|
274
|
+
- [CMS y sincronización en vivo](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/intlayer_CMS.md)
|
package/docs/es/roadmap.md
CHANGED
|
@@ -112,18 +112,16 @@ Intlayer proporciona varios métodos para insertar y gestionar contenido dinámi
|
|
|
112
112
|
Intlayer soporta **TypeScript** (también JavaScript) y **JSON** para declarar contenido.
|
|
113
113
|
|
|
114
114
|
- **TypeScript**:
|
|
115
|
-
|
|
116
115
|
- Garantiza que la estructura de tu contenido sea correcta y que no falten traducciones.
|
|
117
116
|
- Ofrece modos de validación estrictos o más flexibles.
|
|
118
117
|
- Permite la obtención dinámica de datos desde variables, funciones o APIs externas.
|
|
119
118
|
|
|
120
119
|
- **JSON**:
|
|
121
|
-
|
|
122
120
|
- Facilita la integración con herramientas externas (como editores visuales) debido a su formato estandarizado.
|
|
123
121
|
|
|
124
122
|
> Recursos:
|
|
125
123
|
>
|
|
126
|
-
> - [Formatos de Declaración de Contenido](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/dictionary/
|
|
124
|
+
> - [Formatos de Declaración de Contenido](https://github.com/aymericzip/intlayer/blob/main/docs/docs/es/dictionary/content_file.md)
|
|
127
125
|
|
|
128
126
|
### 7. Purga, optimización del paquete e importaciones dinámicas
|
|
129
127
|
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2025-03-17
|
|
3
|
-
updatedAt: 2025-
|
|
3
|
+
updatedAt: 2025-09-22
|
|
4
4
|
title: Extensión Oficial de VS Code
|
|
5
5
|
description: Aprende a usar la extensión Intlayer en VS Code para mejorar tu flujo de trabajo de desarrollo. Navega rápidamente entre contenido localizado y gestiona tus diccionarios de manera eficiente.
|
|
6
6
|
keywords:
|
|
7
|
-
- Extensión VS Code
|
|
7
|
+
- Extensión de VS Code
|
|
8
8
|
- Intlayer
|
|
9
9
|
- Localización
|
|
10
10
|
- Herramientas de Desarrollo
|
|
@@ -15,12 +15,11 @@ keywords:
|
|
|
15
15
|
slugs:
|
|
16
16
|
- doc
|
|
17
17
|
- vs-code-extension
|
|
18
|
-
applicationTemplate: https://github.com/aymericzip/intlayer-vs-code-extension
|
|
19
18
|
---
|
|
20
19
|
|
|
21
20
|
# Extensión Oficial de VS Code
|
|
22
21
|
|
|
23
|
-
##
|
|
22
|
+
## Visión General
|
|
24
23
|
|
|
25
24
|
[**Intlayer**](https://marketplace.visualstudio.com/items?itemName=Intlayer.intlayer-vs-code-extension) es la extensión oficial de Visual Studio Code para **Intlayer**, diseñada para mejorar la experiencia del desarrollador al trabajar con contenido localizado en tus proyectos.
|
|
26
25
|
|
|
@@ -32,27 +31,75 @@ Enlace de la extensión: [https://marketplace.visualstudio.com/items?itemName=In
|
|
|
32
31
|
|
|
33
32
|
### Navegación Instantánea
|
|
34
33
|
|
|
35
|
-
**Soporte para Ir a la Definición** – Usa
|
|
36
|
-
**Integración Perfecta** – Funciona sin
|
|
34
|
+
**Soporte para Ir a la Definición** – Usa `⌘ + Click` (Mac) o `Ctrl + Click` (Windows/Linux) sobre una clave `useIntlayer` para abrir instantáneamente el archivo de contenido correspondiente.
|
|
35
|
+
**Integración Perfecta** – Funciona sin problemas con proyectos **react-intlayer** y **next-intlayer**.
|
|
37
36
|
**Soporte Multilingüe** – Soporta contenido localizado en diferentes idiomas.
|
|
38
|
-
**Integración con VS Code** – Se integra
|
|
37
|
+
**Integración con VS Code** – Se integra de manera fluida con la navegación y la paleta de comandos de VS Code.
|
|
39
38
|
|
|
40
|
-
### Comandos para Gestión de Diccionarios
|
|
39
|
+
### Comandos para la Gestión de Diccionarios
|
|
41
40
|
|
|
42
41
|
Gestiona tus diccionarios de contenido directamente desde VS Code:
|
|
43
42
|
|
|
44
|
-
- **Construir Diccionarios**
|
|
45
|
-
- **Subir Diccionarios**
|
|
46
|
-
- **Descargar Diccionarios**
|
|
43
|
+
- **Construir Diccionarios** – Genera archivos de contenido basados en la estructura de tu proyecto.
|
|
44
|
+
- **Subir Diccionarios** – Sube el contenido más reciente del diccionario a tu repositorio.
|
|
45
|
+
- **Descargar Diccionarios** – Sincroniza el contenido más reciente del diccionario desde tu repositorio a tu entorno local.
|
|
46
|
+
- **Rellenar Diccionarios** – Llena los diccionarios con contenido de tu proyecto.
|
|
47
|
+
- **Probar Diccionarios** – Identifica traducciones faltantes o incompletas.
|
|
47
48
|
|
|
48
|
-
### Generador de
|
|
49
|
+
### Generador de Declaración de Contenido
|
|
49
50
|
|
|
50
51
|
Genera fácilmente archivos de diccionario estructurados en diferentes formatos:
|
|
51
52
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
53
|
+
Si estás trabajando actualmente en un componente, generará el archivo `.content.{ts,tsx,js,jsx,mjs,cjs,json}` para ti.
|
|
54
|
+
|
|
55
|
+
Ejemplo de componente:
|
|
56
|
+
|
|
57
|
+
```tsx fileName="src/components/MyComponent/index.tsx"
|
|
58
|
+
const MyComponent = () => {
|
|
59
|
+
const { myTranslatedContent } = useIntlayer("my-component");
|
|
60
|
+
|
|
61
|
+
return <span>{myTranslatedContent}</span>;
|
|
62
|
+
};
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
Archivo generado en formato TypeScript:
|
|
66
|
+
|
|
67
|
+
```tsx fileName="src/components/MyComponent/index.content.ts"
|
|
68
|
+
import { t, type Dictionary } from "intlayer";
|
|
69
|
+
|
|
70
|
+
const componentContent = {
|
|
71
|
+
key: "my-component",
|
|
72
|
+
content: {
|
|
73
|
+
myTranslatedContent: t({
|
|
74
|
+
en: "Hello World",
|
|
75
|
+
es: "Hola Mundo",
|
|
76
|
+
fr: "Bonjour le monde",
|
|
77
|
+
}),
|
|
78
|
+
},
|
|
79
|
+
};
|
|
80
|
+
|
|
81
|
+
export default componentContent;
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
Formatos disponibles:
|
|
85
|
+
|
|
86
|
+
- **TypeScript (`.ts`)**
|
|
87
|
+
- **Módulo ES (`.esm`)**
|
|
88
|
+
- **CommonJS (`.cjs`)**
|
|
89
|
+
- **JSON (`.json`)**
|
|
90
|
+
|
|
91
|
+
### Pestaña Intlayer (Barra de Actividad)
|
|
92
|
+
|
|
93
|
+
Abre la pestaña de Intlayer haciendo clic en el ícono de Intlayer en la Barra de Actividades de VS Code. Contiene dos vistas:
|
|
94
|
+
|
|
95
|
+
- **Buscar**: Una barra de búsqueda en vivo para filtrar rápidamente los diccionarios y su contenido. Al escribir, los resultados se actualizan instantáneamente.
|
|
96
|
+
- **Diccionarios**: Una vista en árbol de tus entornos/proyectos, claves de diccionario y los archivos que aportan entradas. Puedes:
|
|
97
|
+
- Hacer clic en un archivo para abrirlo en el editor.
|
|
98
|
+
- Usar la barra de herramientas para ejecutar acciones: Construir, Extraer (Pull), Enviar (Push), Rellenar, Actualizar, Probar y Crear Archivo de Diccionario.
|
|
99
|
+
- Usar el menú contextual para acciones específicas del ítem:
|
|
100
|
+
- En un diccionario: Extraer (Pull) o Enviar (Push)
|
|
101
|
+
- En un archivo: Rellenar Diccionario
|
|
102
|
+
- Cuando cambias de editor, el árbol revelará el archivo correspondiente si pertenece a un diccionario.
|
|
56
103
|
|
|
57
104
|
## Instalación
|
|
58
105
|
|
|
@@ -63,12 +110,6 @@ Puedes instalar **Intlayer** directamente desde el Marketplace de VS Code:
|
|
|
63
110
|
3. Busca **"Intlayer"**.
|
|
64
111
|
4. Haz clic en **Instalar**.
|
|
65
112
|
|
|
66
|
-
Alternativamente, instálalo desde la línea de comandos:
|
|
67
|
-
|
|
68
|
-
```sh
|
|
69
|
-
code --install-extension intlayer
|
|
70
|
-
```
|
|
71
|
-
|
|
72
113
|
## Uso
|
|
73
114
|
|
|
74
115
|
### Navegación Rápida
|
|
@@ -80,11 +121,19 @@ code --install-extension intlayer
|
|
|
80
121
|
const content = useIntlayer("app");
|
|
81
122
|
```
|
|
82
123
|
|
|
83
|
-
3. **
|
|
124
|
+
3. Haz **Command-click** (`⌘+Click` en macOS) o **Ctrl+Click** (en Windows/Linux) sobre la clave (por ejemplo, `"app"`).
|
|
84
125
|
4. VS Code abrirá automáticamente el archivo de diccionario correspondiente, por ejemplo, `src/app.content.ts`.
|
|
85
126
|
|
|
86
127
|
### Gestión de Diccionarios de Contenido
|
|
87
128
|
|
|
129
|
+
### Pestaña Intlayer (Barra de Actividades)
|
|
130
|
+
|
|
131
|
+
Usa la pestaña lateral para explorar y gestionar diccionarios:
|
|
132
|
+
|
|
133
|
+
- Abre el ícono de Intlayer en la Barra de Actividades.
|
|
134
|
+
- En **Buscar**, escribe para filtrar diccionarios y entradas en tiempo real.
|
|
135
|
+
- En **Diccionarios**, navega por entornos, diccionarios y archivos. Usa la barra de herramientas para Construir, Extraer, Enviar, Rellenar, Actualizar, Probar y Crear Archivo de Diccionario. Haz clic derecho para acciones contextuales (Extraer/Enviar en diccionarios, Rellenar en archivos). El archivo actual del editor se revela automáticamente en el árbol cuando es aplicable.
|
|
136
|
+
|
|
88
137
|
#### Construcción de Diccionarios
|
|
89
138
|
|
|
90
139
|
Genera todos los archivos de contenido del diccionario con:
|
|
@@ -95,7 +144,7 @@ Cmd + Shift + P (macOS) / Ctrl + Shift + P (Windows/Linux)
|
|
|
95
144
|
|
|
96
145
|
Busca **Construir Diccionarios** y ejecuta el comando.
|
|
97
146
|
|
|
98
|
-
####
|
|
147
|
+
#### Envío de Diccionarios
|
|
99
148
|
|
|
100
149
|
Sube el contenido más reciente del diccionario:
|
|
101
150
|
|
|
@@ -103,51 +152,32 @@ Sube el contenido más reciente del diccionario:
|
|
|
103
152
|
2. Busca **Enviar Diccionarios**.
|
|
104
153
|
3. Selecciona los diccionarios a enviar y confirma.
|
|
105
154
|
|
|
106
|
-
####
|
|
155
|
+
#### Extracción de Diccionarios
|
|
107
156
|
|
|
108
157
|
Sincroniza el contenido más reciente del diccionario:
|
|
109
158
|
|
|
110
159
|
1. Abre la **Paleta de Comandos**.
|
|
111
|
-
2. Busca **
|
|
112
|
-
3. Elige los diccionarios
|
|
113
|
-
|
|
114
|
-
## Desarrollo y Contribución
|
|
115
|
-
|
|
116
|
-
¿Quieres contribuir? ¡Damos la bienvenida a las contribuciones de la comunidad!
|
|
160
|
+
2. Busca **Extraer Diccionarios**.
|
|
161
|
+
3. Elige los diccionarios que deseas extraer.
|
|
117
162
|
|
|
118
|
-
|
|
163
|
+
#### Rellenar Diccionarios
|
|
119
164
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
Clona el repositorio e instala las dependencias:
|
|
123
|
-
|
|
124
|
-
```sh
|
|
125
|
-
git clone https://github.com/aymericzip/intlayer-vs-code-extension.git
|
|
126
|
-
cd intlayer-vs-code-extension
|
|
127
|
-
npm install
|
|
128
|
-
```
|
|
165
|
+
Rellena los diccionarios con contenido de tu proyecto:
|
|
129
166
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
1. Abre el proyecto en **VS Code**.
|
|
135
|
-
2. Presiona `F5` para lanzar una nueva ventana de **Host de Desarrollo de Extensión**.
|
|
136
|
-
|
|
137
|
-
### Enviar una Pull Request
|
|
138
|
-
|
|
139
|
-
Si mejoras la extensión, envía una PR en [GitHub](https://github.com/aymericzip/intlayer-vs-code-extension).
|
|
140
|
-
|
|
141
|
-
## Comentarios y Problemas
|
|
142
|
-
|
|
143
|
-
¿Encontraste un error o tienes una solicitud de función? Abre un issue en nuestro **repositorio de GitHub**:
|
|
167
|
+
1. Abre la **Paleta de Comandos**.
|
|
168
|
+
2. Busca **Rellenar Diccionarios**.
|
|
169
|
+
3. Ejecuta el comando para poblar los diccionarios.
|
|
144
170
|
|
|
145
|
-
|
|
171
|
+
#### Probar Diccionarios
|
|
146
172
|
|
|
147
|
-
|
|
173
|
+
Valida los diccionarios y encuentra traducciones faltantes:
|
|
148
174
|
|
|
149
|
-
|
|
175
|
+
1. Abre la **Paleta de Comandos**.
|
|
176
|
+
2. Busca **Probar Diccionarios**.
|
|
177
|
+
3. Revisa los problemas reportados y corrígelos según sea necesario.
|
|
150
178
|
|
|
151
|
-
## Historial
|
|
179
|
+
## Historial del Documento
|
|
152
180
|
|
|
153
|
-
|
|
181
|
+
| Versión | Fecha | Cambios |
|
|
182
|
+
| ------- | ---------- | ----------------- |
|
|
183
|
+
| 5.5.10 | 2025-06-29 | Historial inicial |
|