Mesclar bibliotecas javascript com typescript | Typescript parte 3: mais técnicas e boas práticas

Boa tarde Flávio,

Aproveitando o curso do typescript e buscando utilizar o máximo possível uma única linguagem para desenvolver tanto no back, como no front-end (já faço isso com o javascript), eu gostaria de saber se é possível fazer isso com typescript? eu fico em dúvida em situações que temos que usar pacotes de terceiros, como por exemplo no back-end um pacote para ler a porta serial; então como mesclar código em javascript e typescript ao mesmo tempo; nas minhas classes eu utilizaria o typescript, que será convertido para javascript; mas para adotar somente o typescript, no momento de construir as classes em typescript eu precisaria interagir com as outras bibliotecas (pacotes) que eu instalei, por exemplo através do npm e que são em javascript; há uma solução pra essa situação? Como você tem agido diante desse desafio?

Oi Andre!

O Typescript é um superset do Javascript, ou seja, o código Javascript ainda é válido dentro do Typescript, porém o contrário não é verdadeiro. Sendo assim, qualquer código Javascript será válido dentro de um arquivo .ts e as variáveis serão entendidas como any.

Entretanto se você tentar aplicar regras específicas do Typescript, como interfaces e enums num arquivo .js, o interpretador apontará erros de sintaxe.

Portanto, utilizar bibliotecas escritas em Javascript numa base de dados escrita em Typescript não tem problema, mas você não terá checagem de tipos das importações da biblioteca. Pensando nisso, um grupo de pessoas criou o projeto DefinitelyTyped, com objetivo de criar tipagens à bibliotecas escritas em Javascript.

Por exemplo, a biblioteca serialport é escrita em Javascript, ou seja, não é tipada. Por ser em Javascript, você pode tranquilamente utilizá-la em um projeto Typescript, porém o intellisense do editor de código não conseguirá te auxiliar. Além da inclusão da biblioteca, você pode adicionar como dependência de desenvolvimento a biblioteca exclusivamente de tipos, da seguinte maneira:

npm i @types/serialport -D

Agora você terá 2 bibliotecas, a serialport responsável pela lógica e a @types/serialport responsável apenas pela tipagem das funções/variáveis exportadas pela biblioteca anterior.

Para verificar se a biblioteca Javascript que você está utilizando tem uma biblioteca auxiliar de tipos, basta digitar no Google o nome da biblioteca + "@types". Creio que todas as bibliotecas populares escritas em Javascript já estejam dentro do DefinitelyTyped.

Espero ter ajudado! Qualquer outra dúvida pode postar aqui! :)