tsconfig.json — Animate | AI Wisdom

← Back to topic
🎞 ANIMATE · Mode 3 of 5 · +100 XP— tsconfig.json
📋Target/Module
⚙️Strict
🔄Output
✅Aliases
🎯 Next: Test →
Step 1 / 4
Speed
Target/Module
target and module control output JS and module format💡 Analogy
Like choosing the language edition for a translated document — ES2022 is modern English, ES5 is formal Victorian.
target: ES2022 means TypeScript can emit modern JS syntax (optional chaining, nullish coalescing). module: NodeNext uses Node 18+ ESM with proper import/export.
Console Output
> target: ES2022 → async/await, ?? operator emitted natively
> module: NodeNext → import/export syntax, .js extensions required
●tsconfig.json
Target/ModuleL3–5
1{
2  "compilerOptions": {
3    // Target and module format
4    "target": "ES2022",         // Output JS version
5    "module": "NodeNext",       // Module system (ESM with conditions)
6    "moduleResolution": "NodeNext",
7 
8    // Strictness — ALWAYS enable in new projects
9    "strict": true,             // Enables all strict checks
10    "noUncheckedIndexedAccess": true,  // arr[0] is T | undefined
11    "exactOptionalPropertyTypes": true,
12 
13    // Output
14    "outDir": "./dist",
15    "rootDir": "./src",
16    "declaration": true,        // Emit .d.ts files
17    "declarationMap": true,     // Source maps for .d.ts
18 
19    // Path aliases
20    "baseUrl": ".",
21    "paths": {
22      "@/*": ["src/*"],
23      "@components/*": ["src/components/*"]
24    },
25 
26    // Performance
27    "incremental": true,        // Cache for faster rebuilds
28    "composite": true,          // Required for project references
29    "isolatedModules": true,    // Each file independently compilable
30 
31    // Libraries available in scope
32    "lib": ["ES2022", "DOM", "DOM.Iterable"]
33  },
34  "include": ["src/**/*"],
35  "exclude": ["node_modules", "dist"]
36}
36 lines
Timeline — 4 Steps
Target/Module
target and module control output JS and module format💡 Analogy
Like choosing the language edition for a translated document — ES2022 is modern English, ES5 is formal Victorian.
target: ES2022 means TypeScript can emit modern JS syntax (optional chaining, nullish coalescing). module: NodeNext uses Node 18+ ESM with proper import/export.
Console Output
> target: ES2022 → async/await, ?? operator emitted natively
> module: NodeNext → import/export syntax, .js extensions required

Was this page helpful?

Discussion

target and module control output JS and module format

💡 Analogy

Like choosing the language edition for a translated document — ES2022 is modern English, ES5 is formal Victorian.

target: ES2022 means TypeScript can emit modern JS syntax (optional chaining, nullish coalescing). module: NodeNext uses Node 18+ ESM with proper import/export.

Console Output

> target: ES2022 → async/await, ?? operator emitted natively
> module: NodeNext → import/export syntax, .js extensions required

target and module control output JS and module format

💡 Analogy

Like choosing the language edition for a translated document — ES2022 is modern English, ES5 is formal Victorian.

target: ES2022 means TypeScript can emit modern JS syntax (optional chaining, nullish coalescing). module: NodeNext uses Node 18+ ESM with proper import/export.

Console Output

> target: ES2022 → async/await, ?? operator emitted natively
> module: NodeNext → import/export syntax, .js extensions required