De JSON5 à JSONC : une expérience de formatage JSON plus tolérante
Quand un simple oubli de virgule vous fait passer la nuit à déboguer un fichier JSON, il est peut-être temps de rencontrer ses cousins plus indulgents — JSON5 et JSON with Comments (JSONC).
Qu’est-ce que JSON5 ?
JSON5 est une extension de JSON qui intègre des fonctionnalités d’ECMAScript 5.1 : clés sans guillemets, virgules finales, chaînes entre guillemets simples, commentaires et nombres hexadécimaux. Maintenu par la communauté, il rend les fichiers de configuration écrits à la main plus lisibles et tolérants que le JSON strict.
Qu’est-ce que JSONC ?
JSONC (JSON with Comments) est une extension minimale du JSON standard ajoutant les commentaires sur une ligne (//) et sur plusieurs lignes (/* */), ainsi que les virgules finales. Maintenu par Microsoft, c’est le format natif des paramètres VS Code, de tsconfig.json et d’autres fichiers de configuration TypeScript.
Pourquoi avons-nous besoin d’un JSON « tolérant » ?
- Lisibilité : Le JSON strict refuse les commentaires, virgules finales, guillemets simples. Les fichiers de configuration deviennent opaques.
- Collaboration : Maintenir du JSON volumineux sans annotations rend les modifications fragiles.
- Réalisme DevOps : Kubernetes et CI/CD exigent souvent une fusion/génération dynamique ; une syntaxe flexible réduit les corrections manuelles.
JSON5 vs JSONC : comparaison
| Fonctionnalité | JSON strict | JSON5 | JSONC |
|---|---|---|---|
Commentaires // | Non | Oui | Oui |
Commentaires /* */ | Non | Oui | Oui |
| Virgules finales | Non | Oui | Oui |
| Guillemets simples | Non | Oui | Non |
| Clés sans guillemets | Non | Oui | Non |
| Signes numériques +/- | Non | Oui | Non |
| Nombres hexadécimaux/binaires | Non | Oui | Non |
| Mainteneurs de la spec | ECMA | Communauté (A. Rauschmayer) | Microsoft / VS Code |
Distinction clé : JSON5 ressemble à un littéral d’objet JavaScript, tandis que JSONC ajoute simplement des commentaires au JSON standard.
Exemples de syntaxe
JSON classique (strict)
{
"name": "Go Tools",
"features": ["Base64", "JSON Formatter"]
}JSON5
// Configuration du projet
{
name: 'Go Tools', // guillemets simples & clés sans guillemets
features: [
'Base64',
'JSON Formatter', // virgule finale
],
version: 1.0, // nombre non-chaîne autorisé
}JSONC
{
// Nom du projet
"name": "Go Tools",
// Liste des fonctionnalités
"features": [
"Base64",
"JSON Formatter", // virgule finale
]
}Outils de formatage & de parsing
| Contexte | JSON5 | JSONC | Outils recommandés |
|---|---|---|---|
| Navigateur | Polyfill JSON5.parse(), Prettier >= v1.13 | Support natif VS Code settings.json | — |
| Node.js | Package npm json5 | comment-json, jsonc-parser | Formatage CLI & parsing AST |
| IDE | Extensions VS Code, WebStorm | VS Code natif, plugin WebStorm | Prettier unifie le formatage |
| CI / Lint | eslint-plugin-json5 | eslint-plugin-jsonc | Intégration Husky & lint-staged |
| Outil en ligne | Go Tools JSON Formatter (embellit & valide JSON5/JSONC) | Idem | JSON Formatter |
Formatage rapide dans VS Code
Ajouter à settings.json :
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}Puis appuyer sur Alt + Shift + F pour embellir.
Conseils pratiques & pièges
1. Conversion avant production
- Les navigateurs requièrent du JSON strict pour
JSON.parse(). - Utiliser
rollup-plugin-json5ou des scripts personnalisés pour transpiler lors du build.
2. Sécurité & fiabilité
- Une syntaxe tolérante peut dissimuler des champs indésirables ; valider avec JSON Schema ou
zodavant exposition d’API.
3. Convention d’équipe
- Documenter que les fichiers
*.json5sont réservés aux configs ; les paquets publiés doivent contenir du.jsonstrict. - Uniformiser les règles Prettier pour éviter les diffs inutiles.
4. Performance
- Le parsing JSON5/JSONC ajoute des dépendances et un léger overhead — acceptable pour CLI & dev, à mesurer en production.
Questions Fréquentes
Quelle est la différence entre JSON5 et JSONC ?
JSON5 étend JSON avec une syntaxe proche de JavaScript : clés sans guillemets, virgules finales, commentaires en ligne et en bloc, nombres hexadécimaux et chaînes multilignes. JSONC est plus simple — il ajoute uniquement les commentaires en ligne (//) et en bloc (/* */) au JSON standard. Choisissez JSONC quand les commentaires suffisent ; choisissez JSON5 quand vous avez besoin d’une syntaxe plus riche.
Peut-on utiliser JSON5 ou JSONC dans les API de production ?
Non — JSON5 et JSONC sont conçus pour les fichiers de configuration, pas pour l’échange de données. Les API doivent utiliser du JSON standard (RFC 8259) pour une interopérabilité maximale. Réservez JSON5/JSONC aux fichiers de configuration locaux comme tsconfig.json, .vscode/settings.json ou la configuration d’environnement où la lisibilité humaine prime sur le parsing machine.
VS Code supporte-t-il JSON5 nativement ?
VS Code supporte JSONC nativement (ses propres fichiers de paramètres utilisent JSONC), mais ne supporte pas JSON5 par défaut. Pour JSON5, installez une extension dédiée comme « JSON5 syntax » depuis le marketplace VS Code. Vous pouvez également associer les fichiers .json5 au mode de langage JSON5 dans vos paramètres.
Comment convertir du JSON5 en JSON standard ?
Utilisez le package npm json5 : JSON5.parse() lit le JSON5, puis JSON.stringify() produit du JSON standard. En CLI, exécutez npx json5 < input.json5 > output.json. Des outils en ligne comme notre JSON Formatter peuvent également valider la sortie convertie pour garantir l’exactitude.
JSONC est-il identique à JSON with Comments ?
Oui — JSONC signifie « JSON with Comments » et c’est le format utilisé par VS Code, TypeScript (tsconfig.json) et d’autres outils Microsoft. Il suit la spécification JSON standard avec pour seul ajout les commentaires // et /* */. Les parseurs suppriment les commentaires avant traitement, donc la structure de données résultante est identique au JSON standard.
Pour plus d’outils de développement en navigateur, y compris l’encodage Base64, la génération de hachage et la conversion de timestamps, consultez notre Guide essentiel des outils de développement.
Conclusion
Trouver l’équilibre entre lisibilité et rigueur est un défi classique du développement. JSON5 et JSONC améliorent l’expérience d’écriture, et avec un pipeline de build et une validation appropriés, vous pouvez profiter des avantages du « JSON tolérant » en toute sécurité.