Comandos básicos de inicialização do Typescript

(Baseado no curso de TypeScript para Angular)

1. Inicializar um projeto node:

npm init -y

• Cria a pasta node-modules e os arquivos package.json e package-lock.json.
• O sufixo -y indica ao gerador que o projeto deve ser criado com as opções padrão em vez de perguntar cada informação.

2. Adicionar o typescript ao projeto:

npm install typescript -D

• O sufixo -D indica a utilização do typescript apenas em tempo de desenvolvimento.

3. Inicializar a configuração do typescript:

npm tsc --init

• O arquivo de configuração tsconfig.json é criado.

4. Configurar a pasta de entrada e a pasta de saída para automatizar a transpilação:

"rootDir": "./src",
"outDir": "./build",

• Esses dois atributos (rootDir e outDir) devem ser adicionados ou descomentados e caminhos diferentes providos no arquivo tsconfig.json.
• Aqui definimos a pasta ./src como fonte e a pasta ./buid como alvo.

5. Transpilar os arquivos typescript:

npm tsc

• O compilador busca as configurações no tsconfig.json e aplica suas configurações gerando na pasta alvo arquivos conforme a pasta fonte.

6. Criar spript de transpilação e execução:

"scripts": {
  "start": "npx tsc && node build/index.js"
}

• O script desejado deve ser declarado no objeto scripts dentro arquivo package.json.
• Ele gera o código transpilado e executa o arquivo build/index.js

Esse script será acessado por meio do comando:

npm run start

7. Instalar dependência para executar typescript diretamente:

npm install ts-node-dev -D

• Ao instalar a dependência ts-node-dev damos ao projeto a capacidade de executar typescript em tempo de desenvolvimento.
• O comando -D destaca que a instalação é para escopo de desenvolvimento.

8. Criar script de excecução:

"scripts": {
  "start:dev": "ts-node-dev --respawn --transpile-only src/index.ts"
}

• No arquivo package.json adiciona-se o script acima.
• Ele chama o comando da dependência ts-node-dev com as flags --respawn: para que o ts-node-dev fique observando alterações do código, para transpilar e fazer auto reload da aplicação; e --transpile-only: indicando a necessidade apenas de transpilação sem verificação de erros no código.

Esse script é executado por meio do comando:

npm run start:dev

9. Habilitar decorators

No arquivo tsconfig.json devemos definir ou descomentar a linha:

"experimentalDecorators": true,

• Isso habilitará o decorators, ferramenta experimental que adiciona informação ao pedaço de código decorado.
• A sintaxe de um decorator é a seguinte: @decorator, que aponta para uma função, nesse caso a função decorator().