@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: Nouvelle version Intlayer v6 - Quoi de neuf ?
|
|
5
|
+
description: Découvrez les nouveautés d'Intlayer v6. Améliorations majeures des performances, de l'expérience développeur, et nouvelles fonctionnalités pour optimiser votre flux de travail en internationalisation.
|
|
6
|
+
keywords:
|
|
7
|
+
- Intlayer
|
|
8
|
+
- Localisation
|
|
9
|
+
- Développement
|
|
10
|
+
- Performance
|
|
11
|
+
- Expérience développeur
|
|
12
|
+
- Fonctionnalités
|
|
13
|
+
- React
|
|
14
|
+
- Next.js
|
|
15
|
+
- JavaScript
|
|
16
|
+
- TypeScript
|
|
17
|
+
slugs:
|
|
18
|
+
- doc
|
|
19
|
+
- releases
|
|
20
|
+
- v6
|
|
21
|
+
---
|
|
22
|
+
|
|
23
|
+
# Nouvelle version Intlayer v6 - Quoi de neuf ?
|
|
24
|
+
|
|
25
|
+
Bienvenue dans Intlayer v6 ! Cette version se concentre sur les performances, l'expérience développeur et la fiabilité. Voici les points forts, avec des notes de migration et des exemples à copier-coller.
|
|
26
|
+
|
|
27
|
+
## Points forts
|
|
28
|
+
|
|
29
|
+
- Nouvelle commande : `npx intlayer content test` pour détecter les traductions manquantes
|
|
30
|
+
- Nouvelle option globale `autoFill` pour générer automatiquement les traductions manquantes
|
|
31
|
+
- La commande Fill ignore par défaut les traductions existantes : `npx intlayer fill`
|
|
32
|
+
- Extension VS Code : nouvelle barre d'activité Intlayer (Recherche & Dictionnaires), actions dans la barre d'outils/contexte, auto-révélation, commandes Fill/Test
|
|
33
|
+
- Builds 10× plus rapides grâce à la parallélisation des promesses
|
|
34
|
+
- Mise en cache distante des dictionnaires pour éviter le rechargement au démarrage de l'application
|
|
35
|
+
- Journalisation améliorée : définissez `log.mode: 'verbose'` pour inspecter le comportement
|
|
36
|
+
- Validation renforcée pour éviter les plantages de l'application liés aux dictionnaires
|
|
37
|
+
- Mises à jour en direct avec CMS en utilisant `build.importMode = 'live'` et `pnpm intlayer live`
|
|
38
|
+
- Corrections : intégration Vue.js, adaptateur Lynx, éditeur visuel sous Windows
|
|
39
|
+
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## Nouveau : Tester les traductions manquantes
|
|
43
|
+
|
|
44
|
+
Auditez rapidement votre projet pour identifier les clés/locales manquantes.
|
|
45
|
+
|
|
46
|
+
```bash
|
|
47
|
+
npx intlayer content test
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Sortie :
|
|
51
|
+
|
|
52
|
+
```bash
|
|
53
|
+
pnpm intlayer content test
|
|
54
|
+
Traductions manquantes :
|
|
55
|
+
- blog-data - Japonais (ja), Coréen (ko), Chinois (zh), Allemand (de), Italien (it) - src/components/BlogPage/blogData.content.ts
|
|
56
|
+
- demo-page - Français (fr), Italien (it) - src/components/DemoPage/demo.content.ts
|
|
57
|
+
- locale-switcher - Italien (it), Portugais (pt) - src/components/LocaleSwitcher/localeSwitcher.content.ts
|
|
58
|
+
Locales : Anglais (en), Russe (ru), Japonais (ja), Français (fr), Coréen (ko), Chinois (zh), Espagnol (es), Allemand (de), Arabe (ar), Italien (it), Anglais britannique (en-GB), Portugais (pt), Hindi (hi)
|
|
59
|
+
Locales requises : Anglais (en)
|
|
60
|
+
Locales manquantes : Japonais (ja), Coréen (ko), Chinois (zh), Allemand (de), Italien (it), Français (fr), Portugais (pt)
|
|
61
|
+
Locales requises manquantes : -
|
|
62
|
+
Total des locales manquantes : 7
|
|
63
|
+
Total des locales requises manquantes : 0
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
Voir plus d'options dans la documentation CLI : [Référence CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_cli.md) → "Tester les traductions manquantes". Ainsi que le guide [Tests](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/testing.md).
|
|
67
|
+
|
|
68
|
+
---
|
|
69
|
+
|
|
70
|
+
## Nouveau : AutoRemplissage global pour compléter les traductions manquantes
|
|
71
|
+
|
|
72
|
+
Vous pouvez maintenant activer l'auto-remplissage globalement afin que tout dictionnaire avec des traductions manquantes soit complété automatiquement.
|
|
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
|
+
// Génération automatique des traductions manquantes pour tous les dictionnaires
|
|
85
|
+
autoFill: "./{{fileName}}.content.ts",
|
|
86
|
+
//
|
|
87
|
+
// autoFill: "/messages/{{locale}}/{{key}}/{{fileName}}.content.json",
|
|
88
|
+
//
|
|
89
|
+
// autoFill: true, // génération automatique des traductions manquantes pour tous les dictionnaires comme avec "./{{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
|
+
Vous pouvez toujours affiner par dictionnaire en utilisant le champ `autoFill` dans les fichiers de contenu. Consultez la référence complète dans `doc/autoFill` et `doc/dictionary/content_file`.
|
|
103
|
+
|
|
104
|
+
---
|
|
105
|
+
|
|
106
|
+
## Commande fill : valeurs par défaut plus sûres
|
|
107
|
+
|
|
108
|
+
La commande fill remplit désormais, par défaut, uniquement les traductions manquantes et ignore le contenu existant.
|
|
109
|
+
|
|
110
|
+
```bash
|
|
111
|
+
npx intlayer fill
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
```bash
|
|
115
|
+
Clés de dictionnaire affectées pour le traitement : access-key-creation-form-schema, doc-search-metadata, doc-search-page
|
|
116
|
+
- [access-key-creation-form-schema] Le dictionnaire n'a pas de chemin de fichier. Ignoré.
|
|
117
|
+
- [access-key-creation-form-schema] Traitement de la déclaration de contenu : src/components/Dashboard/ProjectForm/AccessKey/useAccessKeyCreationFormSchema.content.ts
|
|
118
|
+
- [access-key-creation-form-schema] Pas de locales à remplir - Dictionnaire ignoré
|
|
119
|
+
- [doc-search-metadata] Le dictionnaire n'a pas de chemin de fichier. Ignoré.
|
|
120
|
+
- [doc-search-metadata] Traitement de la déclaration de contenu : src/app/[locale]/(docs)/doc/search/metadata.content.ts
|
|
121
|
+
- [doc-search-metadata] Pas de locales à remplir - Dictionnaire ignoré
|
|
122
|
+
- [doc-search-page] Le dictionnaire n'a pas de chemin de fichier. Ignoré.
|
|
123
|
+
- [doc-search-page] Traitement de la déclaration de contenu : src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
124
|
+
- [doc-search-page] [Russe (ru)] Préparation de la traduction du dictionnaire de l'anglais (en) vers le russe (ru)
|
|
125
|
+
[intlayer] Formatage Prettier appliqué à src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
126
|
+
- [doc-search-page] Déclaration de contenu écrite dans src/app/[locale]/(docs)/doc/search/page.content.ts
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
Des exemples de CI sont disponibles dans [CI/CD](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/CI_CD.md).
|
|
130
|
+
|
|
131
|
+
---
|
|
132
|
+
|
|
133
|
+
## Extension VS Code mise à jour
|
|
134
|
+
|
|
135
|
+
L'extension inclut désormais un onglet Intlayer dédié dans la barre d'activité ainsi que plusieurs améliorations du flux de travail :
|
|
136
|
+
|
|
137
|
+
- Barre d'activité Intlayer avec deux vues :
|
|
138
|
+
- Webview de recherche (`intlayer.searchBar`) pour la recherche en direct dans les dictionnaires/contenus
|
|
139
|
+
- Arbre des dictionnaires (`intlayer.dictionaries`) listant les environnements, dictionnaires et fichiers contributeurs
|
|
140
|
+
- Barre d'outils dans la vue Dictionnaires : Construire, Pull, Push, Remplir, Actualiser, Tester, Créer un fichier de dictionnaire
|
|
141
|
+
- Menus contextuels : Pull/Push sur les dictionnaires ; Remplir sur les fichiers
|
|
142
|
+
|
|
143
|
+
- Révélation automatique : le fichier actuellement ouvert dans l’éditeur est mis en surbrillance dans l’arborescence des dictionnaires lorsque cela est applicable
|
|
144
|
+
- Nouvelles commandes disponibles depuis la Palette de commandes : Remplir les dictionnaires et Tester les dictionnaires
|
|
145
|
+
|
|
146
|
+
Voir les détails dans la documentation de l’[Extension officielle VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/vs_code_extension.md).
|
|
147
|
+
|
|
148
|
+
---
|
|
149
|
+
|
|
150
|
+
## Performance : 10× plus rapide
|
|
151
|
+
|
|
152
|
+
- Résolution parallèle des dictionnaires locaux et distants
|
|
153
|
+
- Les dictionnaires distants sont mis en cache pour éviter de les recharger au démarrage de l’application
|
|
154
|
+
|
|
155
|
+
```bash
|
|
156
|
+
npx intlayer build
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
Sortie :
|
|
160
|
+
|
|
161
|
+
```bash
|
|
162
|
+
[intlayer] Préparation d’Intlayer (v6.0.1)
|
|
163
|
+
[intlayer] Dictionnaires :
|
|
164
|
+
[intlayer] ✓ Contenu local : 163/163
|
|
165
|
+
[intlayer] ✓ Contenu distant : 100/100
|
|
166
|
+
[intlayer] - access-key-creation-form [local : ✔ construit] [distant : ✔ importé]
|
|
167
|
+
[intlayer] - access-key-creation-form-schema [local: ✔ construit] [distant: ✔ importé]
|
|
168
|
+
[intlayer] - access-key-form [local: ✔ construit] [distant: ✔ importé]
|
|
169
|
+
[intlayer] - ai-ab-testing-section [distant: ✔ importé]
|
|
170
|
+
[intlayer] - application-not-running-view [local: ✔ construit] [distant: ✔ importé]
|
|
171
|
+
[intlayer] - application-template-message [local: ✔ construit] [distant: ✔ récupéré]
|
|
172
|
+
[intlayer] - aside-navigation [local: ✔ construit] [distant: ✔ importé]
|
|
173
|
+
[intlayer] - ask-reset-password [local: ✔ construit] [distant: ✔ importé]
|
|
174
|
+
[intlayer] - ask-reset-password-schema [local: ✔ construit] [distant: ✔ importé]
|
|
175
|
+
[intlayer] - autocompletion-section [local: ✔ construit] [distant: ✔ récupéré]
|
|
176
|
+
[intlayer] - available-techno-section [local: ✔ construit] [distant: ✔ importé]
|
|
177
|
+
[intlayer] - blog-data [local: ✔ construit]
|
|
178
|
+
[intlayer] - blog-metadata [local: ✔ construit]
|
|
179
|
+
[intlayer] - blog-nav-list [local: ✔ construit] [distant: ✔ importé]
|
|
180
|
+
[intlayer] - blog-page [distant: ✔ récupéré]
|
|
181
|
+
[intlayer] - blog-search-metadata [local: ✔ construit] [distant: ✔ importé]
|
|
182
|
+
[intlayer] - blog-search-page [local: ✔ construit] [distant: ✔ importé]
|
|
183
|
+
...
|
|
184
|
+
[intlayer] Contenu chargé (Total : 8401ms - Local : 4050ms - Distant : 4222ms)
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
---
|
|
188
|
+
|
|
189
|
+
## Améliorations du système de journalisation
|
|
190
|
+
|
|
191
|
+
Le système de journalisation a été amélioré pour fournir des informations plus détaillées sur ce qui se passe lors des transformations à la compilation et à l'exécution.
|
|
192
|
+
|
|
193
|
+
> Activez les journaux détaillés pour mieux comprendre ce qui se passe lors des transformations à la compilation et à l'exécution.
|
|
194
|
+
|
|
195
|
+
```ts fileName="intlayer.config.ts"
|
|
196
|
+
export default {
|
|
197
|
+
log: {
|
|
198
|
+
mode: "verbose", // options : "default" | "verbose" | "disabled"
|
|
199
|
+
},
|
|
200
|
+
};
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
Voir [Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/configuration.md) pour toutes les options de journalisation.
|
|
204
|
+
|
|
205
|
+
---
|
|
206
|
+
|
|
207
|
+
## Validation renforcée
|
|
208
|
+
|
|
209
|
+
Le traitement des dictionnaires effectue désormais une validation plus robuste. Lorsqu'un dictionnaire ne peut pas être traité, Intlayer évite de casser votre application et affiche des erreurs exploitables.
|
|
210
|
+
|
|
211
|
+
---
|
|
212
|
+
|
|
213
|
+
## Mises à jour en direct avec CMS (sécurisé en production)
|
|
214
|
+
|
|
215
|
+
Servez des mises à jour de contenu en direct (par exemple, des mises à jour éditoriales) en production sans reconstruire votre application.
|
|
216
|
+
|
|
217
|
+
1. Activez le mode d'importation en direct :
|
|
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, // activer la synchronisation en direct côté serveur
|
|
228
|
+
},
|
|
229
|
+
};
|
|
230
|
+
|
|
231
|
+
export default config;
|
|
232
|
+
```
|
|
233
|
+
|
|
234
|
+
2. Exécutez votre application et le processus en direct côte à côte :
|
|
235
|
+
|
|
236
|
+
```bash
|
|
237
|
+
npx intlayer live --process 'vite preview'
|
|
238
|
+
```
|
|
239
|
+
|
|
240
|
+
Notes :
|
|
241
|
+
|
|
242
|
+
- Seuls les dictionnaires marqués pour utiliser le mode live seront récupérés en direct. Les autres sont optimisés pour la performance.
|
|
243
|
+
- Repli sur l'importation dynamique si l'API live n'est pas accessible.
|
|
244
|
+
|
|
245
|
+
Voir [CMS et synchronisation en direct](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_CMS.md) et [Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/configuration.md) pour un guide complet.
|
|
246
|
+
|
|
247
|
+
---
|
|
248
|
+
|
|
249
|
+
## Notes de migration
|
|
250
|
+
|
|
251
|
+
- Supprimé : `dictionaryOutput` (précédemment `i18next` ou `next-intl`). Cela reviendra sous forme d'adaptateurs modulables dans les futures versions. Supprimez ce champ de votre configuration.
|
|
252
|
+
- Suppression associée : `i18nextResourcesDir` (voir le journal des modifications de `doc/configuration`).
|
|
253
|
+
- Préférez la nouvelle option globale `content.autoFill` pour générer les traductions manquantes à grande échelle.
|
|
254
|
+
- Utilisez `npx intlayer content test` pour contrôler les PRs sur les traductions manquantes.
|
|
255
|
+
- Pour des diagnostics détaillés, réglez `log.mode = 'verbose'`.
|
|
256
|
+
|
|
257
|
+
---
|
|
258
|
+
|
|
259
|
+
## Corrections
|
|
260
|
+
|
|
261
|
+
- Stabilité de l'intégration Vue.js
|
|
262
|
+
- Améliorations de l'adaptateur Lynx
|
|
263
|
+
- Éditeur visuel sous Windows
|
|
264
|
+
|
|
265
|
+
---
|
|
266
|
+
|
|
267
|
+
## Liens utiles
|
|
268
|
+
|
|
269
|
+
- [Référence CLI](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_cli.md)
|
|
270
|
+
- [Remplissage automatique](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/autoFill.md)
|
|
271
|
+
- [Configuration](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/configuration.md)
|
|
272
|
+
- [Référence fichier de contenu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/content_file.md)
|
|
273
|
+
- [Extension officielle VS Code](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/vs_code_extension.md)
|
|
274
|
+
- [CMS et synchronisation en direct](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/intlayer_CMS.md)
|
package/docs/fr/roadmap.md
CHANGED
|
@@ -112,18 +112,16 @@ Intlayer propose diverses méthodes pour insérer et gérer du contenu dynamique
|
|
|
112
112
|
Intlayer supporte **TypeScript** (ainsi que JavaScript) et **JSON** pour la déclaration du contenu.
|
|
113
113
|
|
|
114
114
|
- **TypeScript** :
|
|
115
|
-
|
|
116
115
|
- Assure que la structure de votre contenu est correcte et qu'aucune traduction n'est manquante.
|
|
117
116
|
- Offre des modes de validation stricts ou plus flexibles.
|
|
118
117
|
- Permet la récupération dynamique de données à partir de variables, fonctions ou API externes.
|
|
119
118
|
|
|
120
119
|
- **JSON** :
|
|
121
|
-
|
|
122
120
|
- Facilite l'intégration avec des outils externes (comme les éditeurs visuels) grâce à son format standardisé.
|
|
123
121
|
|
|
124
122
|
> Ressources :
|
|
125
123
|
>
|
|
126
|
-
> - [Formats de déclaration de contenu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/
|
|
124
|
+
> - [Formats de déclaration de contenu](https://github.com/aymericzip/intlayer/blob/main/docs/docs/fr/dictionary/content_file.md)
|
|
127
125
|
|
|
128
126
|
### 7. Purge, optimisation du bundle et imports dynamiques
|
|
129
127
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
createdAt: 2025-03-17
|
|
3
|
-
updatedAt: 2025-
|
|
3
|
+
updatedAt: 2025-09-22
|
|
4
4
|
title: Extension officielle VS Code
|
|
5
5
|
description: Apprenez à utiliser l'extension Intlayer dans VS Code pour améliorer votre flux de développement. Naviguez rapidement entre les contenus localisés et gérez efficacement vos dictionnaires.
|
|
6
6
|
keywords:
|
|
@@ -29,48 +29,90 @@ Lien de l'extension : [https://marketplace.visualstudio.com/items?itemName=Intla
|
|
|
29
29
|
|
|
30
30
|
## Fonctionnalités
|
|
31
31
|
|
|
32
|
-
### Navigation
|
|
32
|
+
### Navigation instantanée
|
|
33
33
|
|
|
34
|
-
**Support Aller à la
|
|
35
|
-
**Intégration
|
|
36
|
-
**Support
|
|
34
|
+
**Support de Aller à la définition** – Utilisez `⌘ + Clic` (Mac) ou `Ctrl + Clic` (Windows/Linux) sur une clé `useIntlayer` pour ouvrir instantanément le fichier de contenu correspondant.
|
|
35
|
+
**Intégration transparente** – Fonctionne sans effort avec les projets **react-intlayer** et **next-intlayer**.
|
|
36
|
+
**Support multilingue** – Prend en charge le contenu localisé dans différentes langues.
|
|
37
37
|
**Intégration VS Code** – S'intègre parfaitement à la navigation et à la palette de commandes de VS Code.
|
|
38
38
|
|
|
39
|
-
### Commandes de
|
|
39
|
+
### Commandes de gestion des dictionnaires
|
|
40
40
|
|
|
41
41
|
Gérez vos dictionnaires de contenu directement depuis VS Code :
|
|
42
42
|
|
|
43
|
-
- **Construire les
|
|
44
|
-
- **Pousser les
|
|
45
|
-
- **Tirer les
|
|
43
|
+
- **Construire les dictionnaires** – Générez des fichiers de contenu basés sur la structure de votre projet.
|
|
44
|
+
- **Pousser les dictionnaires** – Téléchargez le contenu le plus récent des dictionnaires vers votre dépôt.
|
|
45
|
+
- **Tirer les dictionnaires** – Synchronisez le contenu le plus récent des dictionnaires depuis votre dépôt vers votre environnement local.
|
|
46
|
+
- **Remplir les dictionnaires** – Remplissez les dictionnaires avec le contenu de votre projet.
|
|
47
|
+
- **Tester les dictionnaires** – Identifiez les traductions manquantes ou incomplètes.
|
|
46
48
|
|
|
47
|
-
### Générateur de
|
|
49
|
+
### Générateur de déclaration de contenu
|
|
48
50
|
|
|
49
51
|
Générez facilement des fichiers de dictionnaire structurés dans différents formats :
|
|
50
52
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
53
|
+
Si vous travaillez actuellement sur un composant, il générera pour vous le fichier `.content.{ts,tsx,js,jsx,mjs,cjs,json}`.
|
|
54
|
+
|
|
55
|
+
Exemple de composant :
|
|
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
|
+
Fichier généré au format 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
|
+
Formats disponibles :
|
|
85
|
+
|
|
86
|
+
- **TypeScript (`.ts`)**
|
|
87
|
+
- **Module ES (`.esm`)**
|
|
88
|
+
- **CommonJS (`.cjs`)**
|
|
89
|
+
- **JSON (`.json`)**
|
|
90
|
+
|
|
91
|
+
### Onglet Intlayer (Barre d'activité)
|
|
92
|
+
|
|
93
|
+
Ouvrez l’onglet Intlayer en cliquant sur l’icône Intlayer dans la barre d’activités de VS Code. Il contient deux vues :
|
|
94
|
+
|
|
95
|
+
- **Recherche** : Une barre de recherche en direct pour filtrer rapidement les dictionnaires et leur contenu. La saisie met à jour les résultats instantanément.
|
|
96
|
+
- **Dictionnaires** : Une vue arborescente de vos environnements/projets, des clés de dictionnaire, et des fichiers contribuant aux entrées. Vous pouvez :
|
|
97
|
+
- Cliquer sur un fichier pour l’ouvrir dans l’éditeur.
|
|
98
|
+
- Utiliser la barre d’outils pour exécuter des actions : Construire, Pull, Push, Remplir, Actualiser, Tester, et Créer un fichier de dictionnaire.
|
|
99
|
+
- Utiliser le menu contextuel pour des actions spécifiques à l’élément :
|
|
100
|
+
- Sur un dictionnaire : Pull ou Push
|
|
101
|
+
- Sur un fichier : Remplir le dictionnaire
|
|
102
|
+
- Lorsque vous changez d’éditeur, l’arborescence révélera le fichier correspondant s’il appartient à un dictionnaire.
|
|
55
103
|
|
|
56
104
|
## Installation
|
|
57
105
|
|
|
58
106
|
Vous pouvez installer **Intlayer** directement depuis le Marketplace de VS Code :
|
|
59
107
|
|
|
60
108
|
1. Ouvrez **VS Code**.
|
|
61
|
-
2. Allez dans le **Marketplace des
|
|
109
|
+
2. Allez dans le **Marketplace des extensions**.
|
|
62
110
|
3. Recherchez **"Intlayer"**.
|
|
63
111
|
4. Cliquez sur **Installer**.
|
|
64
112
|
|
|
65
|
-
Sinon, installez-le via la ligne de commande :
|
|
66
|
-
|
|
67
|
-
```sh
|
|
68
|
-
code --install-extension intlayer
|
|
69
|
-
```
|
|
70
|
-
|
|
71
113
|
## Utilisation
|
|
72
114
|
|
|
73
|
-
### Navigation
|
|
115
|
+
### Navigation rapide
|
|
74
116
|
|
|
75
117
|
1. Ouvrez un projet utilisant **react-intlayer**.
|
|
76
118
|
2. Localisez un appel à `useIntlayer()`, par exemple :
|
|
@@ -79,12 +121,20 @@ code --install-extension intlayer
|
|
|
79
121
|
const content = useIntlayer("app");
|
|
80
122
|
```
|
|
81
123
|
|
|
82
|
-
3. **
|
|
124
|
+
3. **Command-clic** (`⌘+Click` sur macOS) ou **Ctrl-clic** (sur Windows/Linux) sur la clé (par exemple, `"app"`).
|
|
83
125
|
4. VS Code ouvrira automatiquement le fichier de dictionnaire correspondant, par exemple `src/app.content.ts`.
|
|
84
126
|
|
|
85
127
|
### Gestion des dictionnaires de contenu
|
|
86
128
|
|
|
87
|
-
|
|
129
|
+
### Onglet Intlayer (Barre d’activités)
|
|
130
|
+
|
|
131
|
+
Utilisez l’onglet latéral pour parcourir et gérer les dictionnaires :
|
|
132
|
+
|
|
133
|
+
- Ouvrez l’icône Intlayer dans la barre d’activités.
|
|
134
|
+
- Dans **Recherche**, tapez pour filtrer les dictionnaires et les entrées en temps réel.
|
|
135
|
+
- Dans **Dictionnaires**, parcourez les environnements, les dictionnaires et les fichiers. Utilisez la barre d’outils pour Construire, Tirer, Pousser, Remplir, Actualiser, Tester et Créer un fichier de dictionnaire. Faites un clic droit pour les actions contextuelles (Tirer/Pousser sur les dictionnaires, Remplir sur les fichiers). Le fichier actuellement ouvert dans l’éditeur se révèle automatiquement dans l’arborescence lorsque c’est applicable.
|
|
136
|
+
|
|
137
|
+
#### Construction des dictionnaires
|
|
88
138
|
|
|
89
139
|
Générez tous les fichiers de contenu des dictionnaires avec :
|
|
90
140
|
|
|
@@ -92,61 +142,42 @@ Générez tous les fichiers de contenu des dictionnaires avec :
|
|
|
92
142
|
Cmd + Shift + P (macOS) / Ctrl + Shift + P (Windows/Linux)
|
|
93
143
|
```
|
|
94
144
|
|
|
95
|
-
Recherchez **
|
|
145
|
+
Recherchez **Construire les dictionnaires** et exécutez la commande.
|
|
96
146
|
|
|
97
|
-
####
|
|
147
|
+
#### Pousser les dictionnaires
|
|
98
148
|
|
|
99
|
-
|
|
149
|
+
Téléchargez le contenu le plus récent des dictionnaires :
|
|
100
150
|
|
|
101
151
|
1. Ouvrez la **Palette de commandes**.
|
|
102
|
-
2. Recherchez **
|
|
103
|
-
3. Sélectionnez les dictionnaires à
|
|
152
|
+
2. Recherchez **Pousser les dictionnaires**.
|
|
153
|
+
3. Sélectionnez les dictionnaires à pousser et confirmez.
|
|
104
154
|
|
|
105
|
-
####
|
|
155
|
+
#### Tirer les dictionnaires
|
|
106
156
|
|
|
107
157
|
Synchronisez le contenu le plus récent des dictionnaires :
|
|
108
158
|
|
|
109
159
|
1. Ouvrez la **Palette de commandes**.
|
|
110
160
|
2. Recherchez **Pull Dictionaries**.
|
|
111
|
-
3. Choisissez les dictionnaires à
|
|
112
|
-
|
|
113
|
-
## Développement & Contribution
|
|
114
|
-
|
|
115
|
-
Vous souhaitez contribuer ? Nous accueillons avec plaisir les contributions de la communauté !
|
|
161
|
+
3. Choisissez les dictionnaires à synchroniser.
|
|
116
162
|
|
|
117
|
-
|
|
163
|
+
#### Remplissage des dictionnaires
|
|
118
164
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
Clonez le dépôt et installez les dépendances :
|
|
122
|
-
|
|
123
|
-
```sh
|
|
124
|
-
git clone https://github.com/aymericzip/intlayer-vs-code-extension.git
|
|
125
|
-
cd intlayer-vs-code-extension
|
|
126
|
-
npm install
|
|
127
|
-
```
|
|
165
|
+
Remplissez les dictionnaires avec le contenu de votre projet :
|
|
128
166
|
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
1. Ouvrez le projet dans **VS Code**.
|
|
134
|
-
2. Appuyez sur `F5` pour lancer une nouvelle fenêtre **Extension Development Host**.
|
|
135
|
-
|
|
136
|
-
### Soumettre une Pull Request
|
|
137
|
-
|
|
138
|
-
Si vous améliorez l'extension, soumettez une PR sur [GitHub](https://github.com/aymericzip/intlayer-vs-code-extension).
|
|
139
|
-
|
|
140
|
-
## Retour d'expérience & Problèmes
|
|
141
|
-
|
|
142
|
-
Vous avez trouvé un bug ou vous souhaitez proposer une fonctionnalité ? Ouvrez un ticket sur notre **dépôt GitHub** :
|
|
167
|
+
1. Ouvrez la **Palette de commandes**.
|
|
168
|
+
2. Recherchez **Fill Dictionaries**.
|
|
169
|
+
3. Exécutez la commande pour peupler les dictionnaires.
|
|
143
170
|
|
|
144
|
-
|
|
171
|
+
#### Test des dictionnaires
|
|
145
172
|
|
|
146
|
-
|
|
173
|
+
Validez les dictionnaires et trouvez les traductions manquantes :
|
|
147
174
|
|
|
148
|
-
|
|
175
|
+
1. Ouvrez la **Palette de commandes**.
|
|
176
|
+
2. Recherchez **Test Dictionaries**.
|
|
177
|
+
3. Passez en revue les problèmes signalés et corrigez-les si nécessaire.
|
|
149
178
|
|
|
150
179
|
## Historique de la documentation
|
|
151
180
|
|
|
152
|
-
|
|
181
|
+
| Version | Date | Modifications |
|
|
182
|
+
| ------- | ---------- | ------------------ |
|
|
183
|
+
| 5.5.10 | 2025-06-29 | Historique initial |
|