How to Add TypeScript to a Node.JS Server With ts-node
We'll get started with TypeScript in this lesson by installing a few necessary packages in our server and setting up the configuration of our TypeScript compiler.
Adding TypeScript to our Server#
📝 This lesson's quiz can be found - here.
🗒️ Solutions for this lesson's quiz can be found - here.
To configure our Node server into a TypeScript project, we'll need to install and use certain TypeScript packages. We'll install the latest versions of the typescript
and ts-node
libraries as development dependencies.
typescript
is the core Typescript library that will help us compile our TypeScript code to valid JavaScript.ts-node
is a utility library that helps us run TypeScript programs in Node.
server $: npm install -D typescript ts-node
tsconfig.json#
The first thing we'll do to introduce TypeScript into our Node server project is create a TypeScript configuration file (tsconfig.json
). The tsconfig.json
file is a JSON file that should be created at the root of a TypeScript project and indicates the parent directory is a TypeScript project. tsconfig.json
is where we can customize our TypeScript configuration and guide our TypeScript compiler with options required to compile the project.
server /
// ...
tsconfig.json
To customize and edit the options of the TypeScript compiler, we'll specify a compilerOptions
key in our tsconfig.json
file.
{
"compilerOptions": {}
}
There are a large number of options we can dictate and control in our compiler of which all can be seen in the TypeScript handbook. We're not going to go through all the different possible options but instead dictate the ones we'll use for our app.
target
#
We'll declare the target
option which specifies the target JavaScript version the compiler will output. Here we'll declare a target output of es6
since Node supports a vast majority of ES6 features.
"target": "es6",
module
#
We'll declare the module
option which refers to the module manager to be used in the compiled JavaScript output. Since CommonJS is the standard in Node, we'll state commonjs
as the module option.
"module": "commonjs",
rootDir
#
To specify the location of files for where we want to declare TypeScript code, we'll use the rootDir
option and give a value of src/
to say we want our compiler to compile the Typescript code in the src/
folder.
"rootDir": "./src",
outDir
#
We can use the outDir
option to specify where we'd want to output the compiled code when we attempt to compile our entire TypeScript project into JavaScript. We'll dictate that we'll want this output code to be in a folder called build/
.
"outDir": "./build",
esModuleInterop
#
To help compile our CommonJS modules in compliance with ES6 modules, we'll need to introduce the esModuleInterop
option and give it a value of true
.
This page is a preview of TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL