TypeScript: Setting Up Our Compiler
Tags: beginners, tutorial, javascript, typescript
Published: 2019-09-18 18:13:43

---
title: TypeScript: Setting Up Our Compiler
published: true
description: TypeScript: Setting Up Our Compiler
tags: beginners, tutorial, javascript, typescript
series: Intro to TypeScript
---

## Intro

In the last article, we talked about the [basic workflow when writing in TypeScript](https://dev.to/miku86/typescript-basic-workflow-pe).

In today's article, we will learn how to configure the TypeScript compiler.

---

## Overview

Our configuration can be made in a file named `tsconfig.json` or at the command line.

For this article, we use `tsconfig.json`.

If we don't have a `tsconfig.json`, we have to use `tsc [filename]` to compile.

If we do have a `tsconfig.json`, we have to use `tsc` to compile, `tsc [filename]` would ignore the `tsconfig.json`

---

## Create a `tsconfig.json`

We can use `tsc --init` to get a default `tsconfig.json`.

This is awesome, because the created `tsconfig.json` has a lot of useful `compilerOptions` in it, including comments.

```
{
  "compilerOptions": {
    /* Basic Options */
    // "incremental": true,                   /* Enable incremental compilation */
    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */
    "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
    // "lib": [],                             /* Specify library files to be included in the compilation. */
    // "allowJs": true,                       /* Allow javascript files to be compiled. */
    ...
}
```

Below the `compilerOptions`, you [can also modify](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html) `files`, `include`, `exclude`, `compileOnSave` and `extends`. 

Most of the time I use:

```
"exclude":[
  "node_modules",
  "build"
]
```

---

## Basic Options

There are nearly 100 options, let's talk about some basic ones:

- `target`: specify ECMAScript target version: `es3` from 1999 is the default option, I use `es2016`, because it has all the new stuff like `const` and `async/await`, but isn't too new to break stuff.
- `declaration`: generates a `.d.ts`, useful for publishing a package
- `sourceMap`: generates a source map, useful for debugging, I use `true`.
- `outDir`: output dir of compiled files, I use `"./build"`
- `removeComments`: removes comments, I use `true`
- `strict`: **very useful** -  enable all strict type-checking options, these are the options that follow directly below. I use `true`
- `noUnusedParameters`: reports unused parameters, I use `true`
- `noImplicitReturns`: reports missing returns,  I use `true`
- `allowSyntheticDefaultImports`: allows default imports from modules with no default export, I use `true`
- `esModuleInterop`: creates namespace objects for all imports, I use `true`    

---

## Next Part

We will learn how to write some basic code.

---

## Further Reading

[`tsconfig.json` Docs](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html)
[TypeScript Compiler Options](https://www.typescriptlang.org/docs/handbook/compiler-options.html)
[my personal tsconfig.json](https://gist.github.com/miku86/9f47c3ebf34cebb2bf47c97d46ffd3d6)