iwantcoding.com
🔥 Daily 👥 Rooms 🏆 Top Log in Sign up

TS Get Started

You don't need to install anything to follow this tutorial — the in-browser editor handles it. For real projects, install Node and TypeScript.

Install TypeScript

SHELL
# In a project directory
npm init -y
npm install -D typescript @types/node
npx tsc --init    # creates tsconfig.json

Your first script

TYPESCRIPT — hello.ts
const name: string = 'world';
console.log(`Hello, ${name}!`);
SHELL
$ npx tsc hello.ts        # emits hello.js
$ node hello.js
Hello, world!

# Or run directly with tsx (the modern choice):
$ npx tsx hello.ts
Hello, world!

Quick-look at tsconfig.json

tsconfig.json
{
  "compilerOptions": {
    "target":           "ES2022",
    "module":           "NodeNext",
    "moduleResolution": "NodeNext",
    "strict":            true,
    "esModuleInterop":   true,
    "skipLibCheck":      true,
    "outDir":            "dist"
  },
  "include": ["src/**/*"]
}

Editor support

EditorSetup
VS CodeOut of the box. Uses your project's TS version automatically.
WebStorm / IntelliJFirst-class TS support.
Neovim / Helix / ZedLSP via typescript-language-server.
Tip: Pin the TypeScript version in package.json and tell your IDE to use the workspace version (VS Code: "Use Workspace Version"). Otherwise CI and your local editor disagree.

Example

Example
// npm install -g typescript
// tsc hello.ts  -> hello.js
console.log('TypeScript compiled to JavaScript');
Try it Yourself »

Exercise

Generate a starter tsconfig with this command.

npx tsc

Test yourself

Q1. Install TypeScript locally with…
Q2. Generate a starter tsconfig.json with…
Q3. For "type-check only" runs use…

Discussion

Loading…