This video is available to students only

Adding TypeScript to our Server

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.

"esModuleInterop": true,

strict

Finally, we'll apply the strict option which enables a series of strict type checking options such as noImplicitAny, noImplicitThis, strictNullChecks, and so on.

"strict": true

The tsconfig.json file of our server project in its entirety will look like the following:

server/tsconfig.json
{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "rootDir": "./src",
    "outDir": "./build",
    "esModuleInterop": true,
    "strict": true
  }
}
Please select a discussion on the left.