Lesson 48 of 55
15 mins readES Modules and Type-Only Imports
In Plain English
TypeScript supports ES module syntax natively. With `import type` and `export type`, you ensure that type declarations are completely erased at compile time with zero runtime overhead.
Core Rules to Remember
import type: Explicitly declares imports used only for type checking, avoiding runtime bundle bloat.
Zero Overhead: TypeScript strips all type-only imports cleanly when emitting JavaScript.
Live Interactive Example
Hit Run Code to see it liveUsing Type-Only Imports and Exports
Python 3.12
1
2
3
4
5
6
7
8
9
10
11
12
13
14
Output Console
Click "Run Code" to view the rendered output.
How it works: Type-only imports guarantee that type declarations generate zero JavaScript runtime code.
Your Turn: Micro Challenge
No pressure! Edit the starter code below and test your solution with instant feedback.
Micro Exercise
Structure a Module Contract
- Define interface ApiResponse<T> with status: number and data: T.
- Define function parseResponse<T>(res: ApiResponse<T>): T that returns res.data.
- Call parseResponse({ status: 200, data: "ok" }) and print the result.
1
2
3
4
5
6
7
8
9
10
11
Sandbox Output
Click "Run & Check" to test your solution.
Finished reading and practicing?
Mark this lesson as completed to update your course progress.