Node.js

Les modules

Découvrir la différence entre ECMAScript et CommonJS, leurs usages et quand les utiliser.

Un module est un fichier JavaScript qui contient du code réutilisable. L'idée est de diviser votre application en petits morceaux indépendants plutôt que d'avoir un seul fichier géant.

Deux systèmes de modules : CommonJS et ESM

Node.js utilise deux systèmes pour organiser le code : CommonJS (historique) et ECMAScript Modules (moderne). Comprendre leurs différences est essentiel pour bien structurer vos projets.

CommonJS

Origine : Créé pour Node.js en 2009, avant que JavaScript n'ait un système de modules natif. C'est le format par défaut de Node.js.

Syntaxe :

// Exportation (math.js ou math.cjs)
module.exports = {
  add: (a, b) => a + b,
}

// Importation
const math = require('./math')
console.log(math.add(2, 3)) // 5

Caractéristiques :

  • Fonctionne nativement dans Node.js sans configuration
  • Chargement synchrone (garanti dans l'ordre)
  • Simple à utiliser
  • Pas compatible navigateurs (sans transpilation)
  • Pas d'optimisation automatique du code (tree-shaking)

Extensions : .js (par défaut) ou .cjs (explicite)

ECMAScript Modules (ESM)

Origine : Standard JavaScript introduit en ES6 (2015) pour unifier les modules entre navigateurs et backend.

Syntaxe :

// Exportation (math.mjs ou math.js avec "type": "module")
export function add(a, b) {
  return a + b
}

// Importation
import { add } from './math.js'

console.log(add(2, 3)) // 5

Caractéristiques :

  • Standard universel (navigateurs + Node.js)
  • Syntaxe moderne et claire (import/export)
  • Tree-shaking : suppression automatique du code non utilisé
  • Chargement asynchrone (adapté au web)
  • Nécessite configuration ("type": "module" dans package.json)

Extensions : .mjs (explicite) ou .js (avec configuration)

Exemple de Tree-Shaking :

// math.js
export function add(a, b) {
  return a + b
}

export function multiply(a, b) {
  return a * b
}

// index.js
import { add } from './math.js' // Seul add() est importé

console.log(add(2, 3))
// :icon{name="i-heroicons-check-circle" class="text-green-500"} Après build : multiply() est supprimée du bundle final (économie de taille)

Avec CommonJS, le tree-shaking est difficile car les imports ne sont pas statiques.

Différences principales

CaractéristiqueCommonJSECMAScript Modules (ESM)
Syntaxe d'importationconst module = require(...)import module from '...'
Syntaxe d'exportationmodule.exports ou exportsexport ou export default
ChargementSynchroneAsynchrone
Extensions typiques.js ou .cjs.mjs ou .js
CompatibilitéSpécifique à Node.jsUniverselle
Configuration supplémentaireAucuneNécessite "type": "module"
Support des navigateursNonOui
Optimisation (tree-shaking)DifficileNative

Lequel utiliser ?

ContexteRecommandation
Nouveau projetESM
Projet existant (CommonJS)CommonJS
Frontend / NavigateurESM
Script simpleCommonJS

Recommandation générale : Utilisez ESM pour tous les nouveaux projets. C'est le standard moderne, compatible navigateurs, et optimisé pour les outils de build actuels.