← Back to TypeScript Course | Chapter 17: TypeScript Configuration | Lesson 3 of 7

Module Resolution

Module resolution is the process TypeScript uses to find the file that an import refers to. The module and moduleResolution settings determine how imports are interpreted for different JavaScript environments.

What Module Resolution Does

When TypeScript sees an import statement, it needs to locate the actual file or package being referenced — module resolution is the set of rules that determines exactly how and where it looks.

Example: What Module Resolution Does

typescript
// import { helper } from "./utils";
// TypeScript must locate the actual utils.ts/.d.ts file this refers to.
console.log("Module resolution determines how imports map to real files");

Node10 Resolution

Node10 resolution follows the traditional Node.js package and file lookup behavior, and is commonly associated with older CommonJS-style projects that predate the package.json exports field.

Example: Node10 Resolution

typescript
// tsconfig.json
// { "compilerOptions": { "moduleResolution": "node10" } }
console.log("Node10 follows traditional CommonJS-style lookup rules");

Node16 and NodeNext

Node16 and NodeNext model modern Node.js module behavior more precisely, including package.json metadata and the real distinction between CommonJS and ES modules, which older resolution modes don't understand.

Example: Node16 and NodeNext

typescript
// tsconfig.json
// { "compilerOptions": { "moduleResolution": "nodenext" } }
console.log("NodeNext models modern Node's package.json exports and ESM/CJS split");

Bundler Resolution

Bundler resolution is designed for projects where a tool like webpack or Vite handles module loading — it supports package exports and bundler-specific conventions without assuming Node's runtime resolution rules apply.

Example: Bundler Resolution

typescript
// tsconfig.json
// { "compilerOptions": { "moduleResolution": "bundler" } }
console.log("Bundler resolution suits projects using webpack/Vite for loading");

Tracing Resolution

The traceResolution compiler flag can print exactly which paths TypeScript tried and why a module lookup succeeded or failed, which is invaluable when debugging a mysterious "cannot find module" error.

Example: Tracing Resolution

typescript
// tsc --traceResolution
console.log("traceResolution prints exactly which paths were tried and why");
🔒

Chapter Quiz — Complete all 7 topics to unlock

0/7 topics done

Complete these topics first:

Login to run this code

C/C++/Java/PHP execution requires a free account. Your code is saved — you'll land right back in the editor after logging in.