TypeScript Project Setup

TypeScript Essentials

TypeScript Project Setup

Beginner Lesson 2 of 9

TypeScript Project Setup

Learn to set up a TypeScript project from scratch.

Initialize Project

# Create directory
mkdir my-ts-project && cd my-ts-project

# Initialize npm
npm init -y

# Install TypeScript
npm install typescript --save-dev

# Create tsconfig.json
npx tsc --init

tsconfig.json

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "lib": ["ES2020", "DOM"],
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

Project Structure

my-ts-project/
├── src/
│   ├── index.ts
│   └── utils/
│       └── helpers.ts
├── dist/
├── package.json
└── tsconfig.json

Build Scripts

{
  "scripts": {
    "build": "tsc",
    "watch": "tsc --watch",
    "start": "node dist/index.js",
    "dev": "ts-node src/index.ts"
  }
}

Development Tools

# ts-node for running TypeScript directly
npm install ts-node --save-dev

# nodemon for auto-restart
npm install nodemon --save-dev

# ESLint for linting
npm install eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin --save-dev

Next Steps

Continue to Basic Types →