Run TypeScript Without Compiling

Introduction

In this post, I will show you how to run TypeScript without compiling it to JavaScript first. This is useful for debugging and testing.

Set up a TypeScript project

Step 1: create a directory

Create a directory for the project.

1
# Create a directory
2
mkdir run-typescript-without-compiling
3

4
# Change directory
5
cd run-typescript-without-compiling

Step 2: initialize a Node.js project

Initialize a Node.js project.

1
# Initialize a Node.js project
2
pnpm init

Step 3: install TypeScript and @types/node

Install TypeScript and @types/node.

1
# Install TypeScript and @types/node
2
pnpm add -D typescript @types/node

Step 4: initialize a TypeScript project

Initialize a TypeScript project.

1
# Initialize a TypeScript project
2
pnpm exec tsc --init

Step 5: create a TypeScript file

Create a TypeScript file.

1
# Create a src directory
2
mkdir src
3

4
# Create a TypeScript file
5
touch src/index.ts

Step 6: example code

Add the following code to the TypeScript file.

1
const sum = (a: number, b: number): number => a + b;
2
const subtract = (a: number, b: number): number => a - b;
3
const multiply = (a: number, b: number): number => a * b;
4
const divide = (a: number, b: number): number => a / b;
5

6
console.log(sum(1, 2));
7
console.log(subtract(1, 2));
8
console.log(multiply(1, 2));
9
console.log(divide(1, 2));

Step 7: run the TypeScript file

Now we install tsx and run the TypeScript file directly. tsx supersedes the older ts-node for this job: it is faster, needs no configuration, and has a watch mode built in, so it replaces ts-node, esr and nodemon with a single dependency.

1
# Install tsx
2
pnpm add -D tsx

Add the following code to the package.json file.

1
{
2
  ...
3
  "scripts": {
4
    "playground": "tsx src/index.ts",
5
    "playground:watch": "tsx watch src/index.ts",
6
    "build": "tsc",
7
    "build:watch": "tsc -w",
8
    "build:debug": "tsc --sourceMap",
9
    "build:debug:watch": "tsc -w --sourceMap",
10
    "start": "node dist/index.js",
11
    "start:watch": "node --watch dist/index.js"
12
  },
13
  ...
14
}

Run the TypeScript file.

1
# Run the TypeScript file
2
pnpm playground
3

4
# Output
5
3
6
-1
7
2
8
0.5

Conclusion

In this post, I showed how to run TypeScript without first converting it to JavaScript. For testing and troubleshooting, that is helpful.

References

• TypeScript Official Website
• TypeScript Documentation
• ts-node on npm
• ts-node GitHub Repository (TypeStrong/ts-node)
• tsx on npm
• Node.js watch mode
• Node.js Official Website
• Node.js Documentation
• Yarn Package Manager
• TypeScript tsconfig.json Reference
• npm package.json Guide
• @types/node package on npm (for Node.js type definitions)
• TypeScript Playground (for quick experiments)