Meu código não compila | TypeScript parte 2: Mais técnicas e boas práticas

Solucionado (ver solução)

Solucionado
(ver solução)

5
respostas

por Pedro Ávila

| 330.4k xp | 175 posts

Boa noite,

Mesmo copiando o código da transcrição do exercício, o mesmo não compila.

import { NegociacaoParcial, Negociacao } from '../models/index';

export class NegociacaoService {

    obterNegociacoes(handler: Function): Promise<Negociacao[]> {

        return fetch('http://localhost:8080/dados')
            .then(res => handler(res))
            .then(res => res.json())
            .then((dados: NegociacaoParcial[]) =>
                dados.map(dado => new Negociacao(new Date(), dado.vezes, dado.montante))
            )
            .catch(err => console.log(err));

    }
}

Erro:

file: 'file:///home/pedro/Dropbox/Cursos/Alura/TypeScript/alurabank/app/ts/services/NegociacaoService.ts'
severity: 'Error'
message: 'Type 'Promise<void | Negociacao[]>' is not assignable to type 'Promise<Negociacao[]>'.
  Type 'void | Negociacao[]' is not assignable to type 'Negociacao[]'.
    Type 'void' is not assignable to type 'Negociacao[]'.'
at: '7,3'
source: 'ts'

pedro@pedro-Deepin:~/Dropbox/Cursos/Alura/TypeScript/alurabank$ node_modules/typescript/bin/tsc -v
Version 2.3.2

5 respostas

por Pedro Ávila

| 330.4k xp | 175 posts

03/08/2017

Mentira!

Meu código compila sim. Percebi que no canto inferior direito do meu VSCode, ele indica TypeScript 2.4.2. Ao passar o mouse em cima, ele aponta para /usr/share/code/resources/app/extensions/node_modules/typescript/lib/tsserver.js.

Porém o compilador TypeScript utilizado no meu projeto está instalado localmente na pasta node_modules do projeto, como informado anteriormente, na versão 2.3.2.

No VSCode, ao clicar sobre o 2.4.2 ele me permite selecionar a versão do TypeScript do workspace (2.3.2). Então o erro desaparece.

De qualquer maneira, alguém sabe dizer por que o código deixa de funcionar na versão 2.4.2? E qual seria a nova maneira?

por Flavio Henrique de Souza Almeida

| 3119.3k xp | 6969 posts

Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

04/08/2017

Você abriu o projeto no VSCode na pasta que tem o arquivo tsconfig.json? Se não fizer isso o VSCode vai ficar louco e adotar uma valiação de TS que vem com ele ignorando seu compilador.

Outra coisa, sendo da área de dev você deve saber que um dev jamais atualiza suas Libs para as versões recentes sem antes verificar no jira por bugs e incompatibilidade (vc n atualizou, sei que foi o vscode).

Seu código está correto. Sugiro postar lá no bug tracking do VSCode ou TypeScript, pois não dá para saber de onde o bug vem.

Mas se quiser calar a boca do compilador pode definir o retorno como o tipo Promise<void | Negociacao[]>. Se não é bug..o TS tá achando que sua API pode não retornar nada, por isso void.

Mas acho que nessa altura do curso você ainda não aprendeu retorno de múltiplo tipos.

solução!

por Pedro Ávila

| 330.4k xp | 175 posts

04/08/2017

Flavio, sim abri o projeto na pasta que possui o arquivo tsconfig.json

pedro@pedro-Deepin:~/Dropbox/Cursos/Alura/TypeScript/alurabank$ ls
api  api.zip  app  node_modules  package.json  tsconfig.json

Mas você está correto, o VSCode estava utilizando o TypeScript 2.4.2 para fazer a validação dos documentos. De maneira simples, o VSCode me permitiu alterar para utilizar o TypeScript local do meu projeto para fazer a validação, e o erro foi embora.

Eu realmente ainda não havia aprendido retorno de múltiplos tipos, porém foi bem simples de compreender a partir do seu código. Desta maneira, utilizando a validação do TypeScript 2.4.2 o código compila.

Quando sobrar um tempinho vou dar uma pesquisada pra ver se entendo o motivo da incompatibilidade.

Abraços e obrigado!

por Flavio Henrique de Souza Almeida

| 3119.3k xp | 6969 posts

Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

04/08/2017

Acho que a versão mais nova é mais precisa, pois pode haver problema no back e dado nenhum chegar, por isso Promise .

por Fabrício

| 352.9k xp | 85 posts

Desenvolvedor Java

09/09/2017

Passei pelo mesmo problema, segui colocando retorno void | Promisse sugerido pelo Flavio. No entanto causa erro na chamada do forEach.

 this._service.obterNegociacoes(isOK)
            .then(negociacoes => {
                negociacoes.forEach(negociacao =>
                    this._negociacoes.adiciona(negociacao));
                this._negociacoesView.update(this._negociacoes);
            })

A mensagem está correta, foreach não funciona com void, agora estou vendo como contornar essa situação.