Skip to content

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 ;

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

Le dossier des codes de ce cours est le suivant :

Image

Ce dossier est celui de l'arborescence complète des scripts (cours-typescript-nestjs-scripts/) présentée dans l'introduction de ce document, et que vous avez téléchargée. Ouvrons dans VSCode le sous-dossier typescript-fondamentaux/ : c'est là que se trouvent les scripts des premiers chapitres de ce cours. Il contient déjà, à sa racine, les deux fichiers package.json et tsconfig.json — examinons-les.

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.
Remarque : il n'y a rien à installer ici. Comme pour tous les autres dossiers de l'arborescence, les dépendances de typescript-fondamentaux/ — et de l'ensemble des scripts de ce cours — ont déjà été installées par un seul npm install, lancé une seule fois à la racine de cours-typescript-nestjs-scripts/ (voir l'introduction de ce document) : c'est ce que montre le dossier node_modules déjà présent à la racine sur la copie d'écran ci-dessus, grâce aux [npm workspaces]. Le projet est donc prêt à l'emploi dès qu'on l'a téléchargé.

Si vous n'avez pas encore téléchargé l'arborescence, ou si vous devez réinstaller ses dépendances, voici, pour rappel, l'unique commande à lancer, une seule fois, à sa racine — elle installe alors la totalité des modules Node.js nécessaires à tous les scripts du cours :

npm install

Les commandes qui suivent sont tapées dans un terminal VSCode positionné sur le dossier [typescript-fondamentaux].

Image

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.