2. Installation d'un environnement de travail

Le document original (2019) détaillait longuement l'installation de [Laragon], [Netbeans] et [Visual Studio Code] sous Windows 10, avec de nombreuses captures d'écran sur la configuration du PATH. En 2026, l'installation est beaucoup plus simple : nous utiliserons les outils suivants.

• [Visual Studio Code] pour écrire le code TypeScript ;
• [Node.js], en version 26 ou plus récente — c'est la version qui a rendu disponible, sans option particulière, l'objet [Temporal] présenté au dernier chapitre de ce document ;
• [TypeScript], en version 6 ;
• [tsx], un outil qui exécute directement un fichier .ts sans étape de compilation préalable — c'est ce que nous utiliserons pour tous les scripts de ce document ;
• [npm] (Node Package Manager), fourni avec Node.js, pour installer les bibliothèques dont nous aurons besoin ;
• un serveur PHP 7 (cf. le cours « Introduction au langage PHP7 par l'exemple »), nécessaire uniquement pour les derniers chapitres de ce document (le client HTTP du service de calcul de l'impôt). Son installation est décrite dans le chapitre correspondant.

2.1. Vérification des outils installés

Une fois Node.js et Visual Studio Code installés, on ouvre un terminal (dans VSCode ou en dehors) et on vérifie les versions installées :

node --version

Résultat (la version exacte peut différer ; 26.x ou plus est recommandé pour ce cours) :

v22.22.2

npx tsc --version

Résultat de l'exécution :

Version 6.0.3

2.2. Mise en place du projet VSCode

Créons un dossier de travail, que nous ouvrons dans VSCode. On y crée deux fichiers à la racine : package.json et tsconfig.json.

2.2.1. Le fichier package.json

Ce fichier liste les dépendances du projet. On y indique aussi "type": "module", pour que Node.js traite nativement nos fichiers comme des modules ECMAScript (avec import/export), sans avoir besoin d'un outil intermédiaire comme c'était le cas en 2019 avec le package esm.

{
  "type": "module",
  "scripts": {
    "check": "tsc --noEmit"
  },
  "devDependencies": {
    "eslint": "^8.57.0",
    "@typescript-eslint/eslint-plugin": "^7.18.0",
    "@typescript-eslint/parser": "^7.18.0",
    "typescript": "^6.0.3",
    "tsx": "^4.19.0",
    "@types/node": "^22.7.0"
  },
  "dependencies": {
    "axios": "^1.7.0",
    "moment": "^2.30.0",
    "qs": "^6.12.0",
    "sprintf-js": "^1.1.3"
  }
}

2.2.2. Le fichier tsconfig.json

Ce fichier configure le compilateur TypeScript. Le mode strict est activé : c'est la configuration recommandée, car elle permet à TypeScript de détecter le plus d'erreurs possible dès la compilation.

{
  "compilerOptions": {
    "target": "ES2023",
    "lib": ["ESNext"],
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "esModuleInterop": true,
    "strict": true,
    "types": ["node"],
    "noEmit": true
  },
  "include": ["**/*.ts"]
}

Important : depuis TypeScript 6.0, la ligne "types": ["node"] est indispensable : sans elle, TypeScript ne reconnaît plus automatiquement les objets globaux de Node.js comme console ou process, contrairement aux versions antérieures à 6.0.

On installe ensuite les dépendances déclarées dans package.json :

npm install

2.3. Premier script

Créons un fichier tests/test-01.ts :

// un 1er programme TypeScript
console.log("hello world!");

On l'exécute depuis le terminal, à la racine du projet :

npx tsx tests/test-01.ts

Résultat de l'exécution :

hello world!

2.4. Second script : la vérification de types

Créons un second fichier tests/test-02.ts, avec une variable typée explicitement :

'use strict'
let x: number = 4;
console.log("x=", x);

npx tsx tests/test-02.ts

Résultat de l'exécution :

x= 4

Essayons maintenant d'affecter une chaîne de caractères à cette variable déclarée number :

x = "abc";

Sans même exécuter le script, VSCode souligne aussitôt la ligne en rouge, et la commande de vérification de types échoue :

npx tsc --noEmit

Résultat de l'exécution :

tests/test-02.ts(4,1): error TS2322: Type 'string' is not assignable to type 'number'.

C'est là tout l'intérêt de TypeScript par rapport à JavaScript : une catégorie entière d'erreurs (mélanger les types par erreur) est détectée avant l'exécution, directement dans l'éditeur, plutôt que découverte au moment où le code plante en production.

2.5. ESLint

[ESLint] est un outil qui vérifie que le code respecte un ensemble de règles de style et de bonnes pratiques (variable non utilisée, comparaison suspecte, etc.). Le fichier de configuration .eslintrc.cjs (l'extension .cjs, et non .js, est nécessaire car package.json déclare "type": "module") utilise le parser @typescript-eslint, qui comprend la syntaxe TypeScript (types, interfaces, champs privés #x...) :

module.exports = {
  root: true,
  env: { node: true, es2024: true },
  extends: ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint"],
  parserOptions: { ecmaVersion: "latest", sourceType: "module" }
};

On analyse alors tout le projet avec :

npx eslint . --ext .ts

2.6. Extension VSCode ESLint

L'extension VSCode nommée [ESLint] (à installer depuis l'onglet des extensions) affiche directement, en temps réel, les avertissements ESLint dans l'éditeur — sans avoir à lancer la commande manuellement à chaque fois.

Nous avons désormais un environnement de travail complet. Le chapitre suivant présente les bases du langage TypeScript.