Génération de tsconfig.json : qu'y a-t-il sous le capot ?

Introduction : Pourquoi tsconfig.json n'est-il pas qu'un simple fichier ?

Quiconque a déjà écrit en TypeScript a rencontré le mystérieux fichier tsconfig.json. Si vous êtes débutant, vous l'avez probablement copié depuis la documentation ou cherché sur Google « comment générer tsconfig.json ». Et si vous êtes un développeur expérimenté, vous vous êtes peut-être déjà demandé : que se passe-t-il réellement sous le capot quand j'exécute tsc --init ?

Dans cet article, nous ne donnerons pas seulement une recette toute prête, mais nous plongerons dans la salle des machines du compilateur TypeScript. Vous découvrirez comment le compilateur lit la configuration, quels flags sont responsables de la rigueur du code, et comment écrire votre propre « générateur » minimal de tsconfig.json à la volée. C'est parti !

1. Qu'est-ce que tsconfig.json et à quoi sert-il ?

tsconfig.json est un fichier JSON qui indique au compilateur TypeScript (tsc) comment traiter votre code. Sans lui, tsc fonctionnera en mode « par défaut », mais cela est souvent insuffisant pour des projets sérieux.

Sous le capot, tsconfig.json définit :

\n
• Quels fichiers compiler (clés include, exclude, files).
\n
• Où placer le résultat (clé outDir).
\n
• Quelles versions de JavaScript prendre en charge (clé target).
\n
• Comment vérifier strictement les types (clés strict, noImplicitAny, etc.).
\n
• Des modules et chemins supplémentaires.
\n

Lorsque vous vous demandez « how can I generate a tsconfig.json file », la réponse est généralement une seule : tsc --init. Mais voyons ce que cette commande génère exactement.

2. La commande tsc --init : qu'y a-t-il sous le capot ?

Exécutez dans le terminal :

npx tsc --init

Un fichier tsconfig.json apparaîtra à la racine du projet avec de nombreux paramètres commentés. En réalité, sous le capot, le compilateur TypeScript exécute l'algorithme suivant :

\n
1. Il vérifie si tsconfig.json existe déjà dans le répertoire courant.
\n
2. Si ce n'est pas le cas, il crée un modèle avec les paramètres par défaut.
\n
3. Il définit target: "es2016", module: "commonjs", strict: true et d'autres valeurs raisonnables.
\n
4. Toutes les autres options sont commentées afin que le développeur puisse les décommenter si nécessaire.
\n

Mais que faire si vous souhaitez personnaliser la génération ? Par exemple, activer immédiatement le mode strict ou définir un chemin pour les fichiers de sortie ? Pour cela, vous pouvez écrire votre propre script.

2.1. Exemple : votre propre générateur de tsconfig.json en TypeScript

Imaginez que vous écrivez un outil pour configurer automatiquement des projets. Voici à quoi pourrait ressembler une fonction qui génère tsconfig.json sous le capot :

import * as fs from 'fs';\nimport * as path from 'path';\n\ninterface TsConfig {\n  compilerOptions: {\n    target: string;\n    module: string;\n    strict: boolean;\n    outDir: string;\n    rootDir: string;\n    esModuleInterop: boolean;\n    skipLibCheck: boolean;\n    forceConsistentCasingInFileNames: boolean;\n  };\n  include: string[];\n  exclude: string[];\n}\n\nfunction generateTsConfig(\n  target: string = 'ES2020',\n  outDir: string = './dist',\n  rootDir: string = './src',\n  strict: boolean = true\n): TsConfig {\n  return {\n    compilerOptions: {\n      target,\n      module: 'commonjs',\n      strict,\n      outDir,\n      rootDir,\n      esModuleInterop: true,\n      skipLibCheck: true,\n      forceConsistentCasingInFileNames: true,\n    },\n    include: ['src/**/*'],\n    exclude: ['node_modules', 'dist'],\n  };\n}\n\n// Générer et sauvegarder\nconst config = generateTsConfig();\nfs.writeFileSync(\n  path.join(process.cwd(), 'tsconfig.json'),\n  JSON.stringify(config, null, 2)\n);\nconsole.log('tsconfig.json créé !');\n