...

/

Transpiling

Transpiling

Learn TypeScript and transpile code into JavaScript for JS-only environments, and understand the fundamentals of the transpilation process.

"Hello TypeScript"

When we run a TypeScript file, the TypeScript compiler is responsible for transpiling it into a corresponding JavaScript file. This process is known as transpiling, allowing us to run our TypeScript code in environments that only support JavaScript, such as a web browser or a Node server.

You might be wondering, where is this JavaScript file that’s being generated? We won’t see it in the code editor—it’s happening behind the scenes. But don’t worry; we’ll take a closer look at the transpiling process in a moment.

For now, let’s just run this simple Hello TypeScript program and see what happens. Go ahead and press the “Run” button to see the output of the following code.

console.log(`Hello TypeScript`);
Simple hello program in TypeScript

Congratulations, you’ve just run your first TypeScript program! As you can see, the program executed exactly as expected, printing the message Hello TypeScript to the console.

In the next step, we’ll take a closer look at the transpiling process and learn how to configure the TypeScript compiler to suit our needs. But for now, let’s savor the moment and congratulate ourselves on a job well done!

Transpiling process

Are you ready to unleash the power of the TypeScript compiler? Great, because it’s time to learn how to transpile a TypeScript file using the tsc command! Take a look at the directory in the terminal below by running the ls command—can you spot the hello_typescript.ts file?

Terminal 1
Terminal
Loading...

Now that we have our hello_typescript.ts file ready to go, it’s time to transpile it into JavaScript using the tsc command. To transpile the hello_typescript.ts file using tsc, run the following command in the terminal above:

tsc hello_typescript.ts

This will generate a ...