Como converter um projeto JavaScript para TypeScript

Converter um projeto JavaScript para TypeScript pode melhorar a qualidade do código e a manutenibilidade adicionando verificação de tipo estático. Este guia fornece um processo passo a passo para converter um projeto JavaScript existente para TypeScript.

Etapa 1: instalar o TypeScript

Comece adicionando TypeScript ao projeto. Isso é feito usando npm ou yarn.

npm install typescript --save-dev

Etapa 2: Crie um arquivo de configuração TypeScript

Crie um arquivo tsconfig.json para configurar o TypeScript. Este arquivo especifica as opções do compilador e os arquivos a serem incluídos na compilação.

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

Etapa 3: renomeie os arquivos JavaScript para TypeScript

Renomeie os arquivos JavaScript de .js para .ts (ou .jsx para .tsx se estiver usando React). Isso permite que o TypeScript processe esses arquivos.

  • Para arquivos contendo JSX, renomeie-os para .tsx.
  • Para arquivos com apenas código TypeScript, renomeie-os para .ts.

Etapa 4: Adicionar definições de tipo

Adicione definições de tipo para bibliotecas de terceiros usadas no projeto. Elas estão disponíveis como pacotes @types no npm.

npm install @types/node @types/express --save-dev

Etapa 5: Corrigir erros do TypeScript

Compile o projeto usando TypeScript e corrija quaisquer erros ou problemas de tipo. O TypeScript fornecerá feedback sobre incompatibilidades de tipo e outros problemas.

npx tsc

Etapa 6: Atualizar scripts de compilação

Atualize os scripts de build em package.json para usar TypeScript. Modifique os scripts para incluir a compilação TypeScript.

"scripts": {
  "build": "tsc",
  "start": "node dist/index.js"
}

Etapa 7: Teste o aplicativo

Execute testes para garantir que o código TypeScript convertido funcione conforme o esperado. Verifique se o aplicativo se comporta corretamente após a conversão.

Conclusão

Converter um projeto JavaScript para TypeScript envolve instalar o TypeScript, configurar o compilador, renomear arquivos, adicionar definições de tipo e resolver erros. Esse processo ajuda a alavancar os recursos do TypeScript para melhor segurança de tipo e manutenibilidade de código.