Modules & Type Imports

TypeScript uses standard ES6 module syntax (`import`/`export`) to organize code across separate files.

1. Standard Export & Import

// math.ts
export interface Point {
  x: number;
  y: number;
}

export function addPoints(p1: Point, p2: Point): Point {
  return { x: p1.x + p2.x, y: p1.y + p2.y };
}

// app.ts
import { Point, addPoints } from './math';

2. Type-Only Imports (`import type`)

Use import type to tell the TypeScript compiler that the imported item is strictly a type declaration. Type-only imports are completely stripped out during compilation, ensuring zero bundle overhead:

// Stripped out 100% during JS compilation!
import type { UserProfile, UserRole } from './types';
import { fetchUserData } from './api';

3. Declaration Merging

Multiple interface declarations sharing the same name in the same scope automatically merge their fields into a single interface:

// First interface declaration
interface Window {
  title: string;
}

// Second interface declaration (Merges into Window!)
interface Window {
  version: number;
}

// Window now has BOTH title and version properties!
const appWindow: Window = {
  title: "My Application",
  version: 2.0
};