Criando um novo projeto com Typescript

Introdução

TypeScript é uma linguagem de programação e também um superconjunto de JavaScript. Isso quer dizer que todo o código JavaScript é perfeitamente aceito em um programa de TypeScript, adicionando uma série de recursos a mais, em especial relacionados a tipagem.

Vantagens

• Feedback mais rápido de erros
• Processo de refatoração mais fácil
• Autocomplete da linguagem, muito boa no vscode
• Poder adotar gradualmente typescript em uma base de código
• Suporta bibliotecas do JavaScript

Você pode saber mais sobre sobre TypeScript no seu site oficial.

Porém, adotar TypeScript pode fazer com que a produtividade do time caia em um primeiro momento, pois existe uma curva de aprendizado que não pode ser ignorada, outro ponto é que para usar TypeScript, você precisa de um processo de construção para compilar para código JavaScript. O processo de construção pode demorar um certo tempo dependendo do tamanho do seu projeto.

Criando o projeto

Vamos criar a pasta para no nosso projeto, e iniciar ele usando npm.

mkdir criando-projeto-typescript
cd criando-projeto-typescript
npm init -y

Após executar os passos acima, será criado um arquivo chamado package.json na raiz do projeto. Para abrir no VSCODE, execute o comando code . na raiz do projeto via terminal.

Configurando o projeto

Precisamos adicionar o TypeScript ao nosso projeto, para que a gente possa usar a tipagem e as outras funcionalidades que o TypeScript nos oferece. Para isso, execute o comando abaixo:

npm i -D typescript

Feito isso vamos criar um arquivo na raiz do nosso projeto chamado tsconfig.json usando o comanda abaixo:

npx tsc --init

Vamos criar um arquivo chamado index.ts e adicionar o seguinte código:

console.log('Olá TypeScript')

Agora vamos compilar o arquivo index.ts para JavaScript, execute o comando abaixo:

npx tsc

Após executar o comando acima, será criado um arquivo chamado index.js na raiz do projeto. Vamos adicionar o pacote ts-node-dev para quando estivermos desenvolvendo não precise compilar o código toda vez que realizarmos alguma alteração, para isso execute o comando abaixo

npm i -D ts-node-dev

Agora vamos criar um script no package.json para compilar o arquivo index.ts para JavaScript, adicione o seguinte código:

"scripts": {
  "start": "node index.js",
  "build": "tsc",
  "dev": "ts-node-dev --ignore-watch node_modules index.ts"
}

Feito isso basta executar o comando npm run [dev/build/start] para iniciar seu desenvolvimento.

Repositório do projeto no GitHub