Convenient development with ts-node on server-side
Tags: node, server, typescript, tutorial
Published: 2019-09-01 10:32:57

This article is a description of some difficulties I met while was configuring a small project for development ts-node server. The main aim of that article is sharing my experience in solving a few problems I met and make the solving process simpler for people who want to solve the same problems in the ts-node development process.

Why is ts-node? I have been using typescript for only one year but firstly was annoyed by it. A little while later, when I had become more familiar with it, I loved this language and in some cases typescript is indispensable. It is necessary to spend more time on development but it will pay off when you have to support code, especially when you doing something involves changes in much code in different places in codebase.

So, below three features I want to have while development:

1. Habitual imports, without `require` or `import * as Smth from 'smth'`, just `import Smth from 'smth'`
2. Demon for server restarting
3. Ability to set `--inspect` flag for debugging in chrome console

### Imports configuring

The first item doesn't look like an intricate task, does it? However, I have spent some time reaching that aim. In all examples I managed to find in the web, imports like `require` or `import * as Smth from 'smth'` was used. In fact, it isn't a problem, but I want to be more concise and finally, I used to use ES6 imports. For using ES6 imports I did the next:

Files structure I used:

```bash
├── src
│   └── index.ts
└── .tsconfig.json
```

- Add to `tsconfig.json`

  ```json
   "compilerOptions": {
      "module": "commonjs",
      "allowSyntheticDefaultImports": true,
      "esModuleInterop": true,
   }
  ```

- npm script for running server:
  ```json
      "scripts" : {
          "dev": "TS_NODE_PROJECT='./tsconfig.json' ts-node src/index.ts"
      }
  ```

### Demon

While developing with node.js I usually prefer to use `nodemon` package. In a few examples, I saw ts-node projects with it. However, as far as I understood, `nodemon` uses previously compiled code. I.e. ts-node watches for files, compile files into a directory pointed as a source to `nodemon`. I don't want to use that way because I want to make ts-node making all work.

I wrote npm script below and actually it works, but...

```json
      "scripts" : {
          "dev": "TS_NODE_PROJECT='./tsconfig.json' nodemon -r ts-node/register ./src/index.ts"
      }
```

But if you add `"noImplicitAny": true,` to your `tsconfig.json` it won't work.
(As far as I understand because of `nodemon` can't have deal with types, but I can mistake)

Moreover, even if you don't add this rule the `--inspect` flag won't work.

Let's go further and take the `ts-node-dev` package. It allows to reach what I want with the next npm script:

```json
      "scripts" : {
          "dev": "TS_NODE_PROJECT='./tsconfig.json' ts-node-dev --respawn ./src src/index.ts"
      }
```

Cool! I have habitual imports and demon without intermediate compilation!

### Debugging

Now it is very simple, just add the `--inspect` flag:

```json
      "scripts" : {
          "dev": "TS_NODE_PROJECT='./tsconfig.json' ts-node-dev  --inspect --respawn ./src src/index.ts"
      }
```

## Recap

Necessary fields in `tsconfig.jsoon`:

```json
{
    "compilerOptions": {
    "module": "commonjs",
    "rootDir": "src",
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "noImplicitAny": true,
  },
    "include": ["src/"],
    "exclude": ["node_modules"]
  }
}
```

npm script:

```json
      "scripts" : {
          "dev": "TS_NODE_PROJECT='./tsconfig.json' ts-node-dev  --inspect --respawn ./src src/index.ts"
      }
```

That's it! Now it is possible to work with typescript on the server-side in a convenient way.
I hope this guide will be helpful for someone and will let avoid wasting time because I have spent several hours to discover all of that.