Installing TypeScript & Setup

Introduction

Before writing any real TypeScript, you need the compiler installed and a basic project set up. This lesson walks through installing TypeScript with npm, understanding what the compiler actually does, configuring a tsconfig.json, and getting your editor to show type errors as you type.

Prerequisites

TypeScript itself runs on Node.js — the TypeScript compiler is a Node program, distributed as an npm package. Before installing TypeScript, you need Node.js and npm installed on your machine. You can check this by running `node --version` and `npm --version` in a terminal; both should print a version number.

Installing TypeScript

You can install TypeScript globally, so the `tsc` command is available anywhere on your machine, or locally inside a specific project, so everyone working on that project (and your CI pipeline) uses the exact same compiler version. The local, per-project install is the recommended approach for real projects.

# Recommended: install as a dev dependency inside a project
npm install --save-dev typescript

# Alternative: install globally (available as `tsc` anywhere)
npm install -g typescript

# Verify the install
npx tsc --version

The TypeScript Compiler (tsc)

The compiler, `tsc`, reads your .ts source files, type-checks them, and emits plain .js files. It is important to remember that TypeScript is never executed directly — browsers and Node.js only ever run the compiled JavaScript output.

# Compile a single file (produces hello.js next to hello.ts)
npx tsc hello.ts

# Run the compiled output with Node
node hello.js

Creating a tsconfig.json

Real projects almost always use a tsconfig.json file, which tells the compiler which files to include and how to compile them, so you can just run `tsc` with no arguments. Generate a starter file with `npx tsc --init`, then trim it down to the essentials.

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "outDir": "dist",
    "rootDir": "src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true
  },
  "include": ["src"]
}

`target` controls which JavaScript version is emitted, `strict` turns on the full family of strict type-checking flags (highly recommended for every new project), `outDir`/`rootDir` control where compiled files go, and `include` limits compilation to your source folder.

Running TypeScript Directly

During development, manually running `tsc` then `node` for every change is slow. Tools like `ts-node` and the newer, faster `tsx` compile and run a .ts file in one step, in memory, without writing a .js file to disk — ideal for scripts and quick iteration. Frameworks like Next.js, Vite, and NestJS bundle equivalent on-the-fly TypeScript support so you never call `tsc` manually during day-to-day development.

npm install -D tsx
npx tsx hello.ts

Setting Up Your Editor

Visual Studio Code has TypeScript support built in out of the box — unsurprising, since both are maintained by Microsoft and share the same underlying language service. Opening a .ts file automatically gives you inline red squiggles for type errors, hover-to-see-type tooltips, autocomplete, and safe rename-across-files refactoring, with no extension required.

Common Mistakes

Best Practices

Frequently Asked Questions

Key Takeaways

Summary

You now have TypeScript installed, understand what the compiler does, and have a working tsconfig.json. With your environment ready, it's time to start learning TypeScript's type system itself, beginning with the basic types.