DEV Community 👩‍💻👨‍💻

Cover image for Como configurar um projeto NodeJS com Typescript
Aryclenio Barros
Aryclenio Barros

Posted on • Updated on

Como configurar um projeto NodeJS com Typescript

Cada vez mais, o typescript se torna uma tendência de mercado e muitos desenvolvedores buscam criar e refatorar seus projetos para se adequarem as novas funcionalidades do Typescript. Neste post, aprenda como criar e consequentemente converter seu projeto NodeJS para o Typescript e aproveitar as funcionalidades de uma linguagem tipada.

Passo 1: Instalação do Yarn e inicialização do projeto Typescript

A primeira tarefa a seguir é a inicialização do projeto npm, que pode ser criado pelo próprio npm como pelo Yarn, que é altamente recomendado pela sua rapidez de instalação e a possibilidade de compartilhamento de dependências entre projetos. Você pode instalar o Yarn no site oficial com versões para Windows, Linux e Mac. Após instalado, utilizamos o comando abaixo para iniciar um projeto npm.

$ yarn init -y
Enter fullscreen mode Exit fullscreen mode

Após a criação, o arquivo package.json deve aparecer em sua estrutura de projeto. O próximo passo é a instalação do próprio typescript como dependência de desenvolvimento com o comando abaixo:

yarn add typescript -D
Enter fullscreen mode Exit fullscreen mode

Feito isso estamos prontos para o código.

Passo 2: Instalando o Express e entendendo o @types

A primeira dependência primordial para um projeto node é a presença do express que pode ser instalado com o comando:

yarn add express
Enter fullscreen mode Exit fullscreen mode

Vamos criar uma pasta src na base do nosso projeto e abrir um arquivo app.ts (a extensão ts se refere ao Typescript). Um dos recursos muito importantes que o Typescript trás é a presença ndo Ecmascript nativo para o arquivo, onde não é mais necessário o uso do require, que é substituido pelo import.
Importamos o express normalmente e ligamos ele na porta 3333, onde nosso arquivo app.ts ficará com essa estrutura.

import express from "express";

app.listen(3333);
Enter fullscreen mode Exit fullscreen mode

Veremos que a importação do express resultará um erro, e isso é uma das propriedades que serão necessárias para todas as dependências em nosso projeto typescript que é a definição de tipos. Toda dependência construída com base em TS necessita de um arquivo que define os tipos de variáveis necessárias para cada argumento de função. Para isso, basta adicionar uma dependência que contem o mesmo nome do pacote que você precisa instalar, porem, com @types/ precedendo seu nome.Portanto, para o express, utilizamos o comando:

yarn add @types/express
Enter fullscreen mode Exit fullscreen mode

Com isso, o erro deve sumir, e essa estrutura deve seguir para as dependências que precisarem de sua definição de tipos instalada

Passo 3: Nodemon? Não mesmo

Para rodar nosso projeto, não utilizaremos o comando node, nem instalaremos o nodemon. Nesse caso, faremos a instalação do ts-node por meio do comando.

yarn add ts-node-dev -D
Enter fullscreen mode Exit fullscreen mode

Com isso, criamos um script no nosso arquivo package.json para rodar o ts-node-dev ao salvar nosso arquivo. Nosso package.json seguirá essa estrutura:


{
  "name": "tsproject",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "dev": "ts-node-dev --transpileOnly --ignore-watch node_modules src/server.ts"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "devDependencies": {
    "@types/express": "^4.17.6",
    "ts-node-dev": "^1.0.0-pre.44",
    "typescript": "^3.9.3"
  }
}
Enter fullscreen mode Exit fullscreen mode

Com isso, nossa estrutura estará completa. No próximo artigo, entenderemos como configurar rotas através de tipos e entender o uso de interfaces de tipos.

Muito obrigado pela leitura!

Top comments (0)

🌚 Life is too short to browse without dark mode