5
respostas

[Dúvida] Meu VSCode não esta fazendo os auto import e esta dando falha

Opa, como o titulo ja diz, meu VsCode nao ta importando nenhum componente sozinho, estou tendo que colocar manualmente Porem acredito que tenha outro arquivo especifico para tambem corrigir manualmente para seguir com a aula

A cor da Tag (L28) tambem não alterou depois que fiz o import manualmente (L4)

Trecho do codigo com falha

5 respostas

Oi, Paulo, tudo bem?

Verifique se você está com as extensões do Vue corretas. Você deve ter a extensão Vue - Official instalada.

Por outro lado, tem uma extensão que foi depreciada e você precisa desinstalá-la, caso esteja habilitada: a TypeScript Vue Plugin (Volar).

Se não for esse o problema, pode subir o seu projeto no GitHub e compartilhar comigo?

Fico no aguardo!

https://github.com/Queroix/cookin-up-aula-2

Esse arquivo foi o baixado inicial na aula 2 e feito as alterações dos videos da aula, Conferi as extenções, eu tinha a extenção depreciada, removi, recarreguei o projeto, mesmo assim sem alteração Problema persiste

Paulo, acredito que o seu repositório está privado, pois a página está dando 404. Consegue alterar a visibilidade dele?

Alterado, nao percebi que criei privado

Oi, Paulo! Testei seu projeto e descobri o motivo do seu problema agora.

Na imagem que você mandou, dá pra conferir que você importou o componente na linha 4, provavelmente usando o auto-import do VSCode. Porém, nem sempre o auto-import faz outra etapa importante na hora de importar um componente Vue, que é adicionar o componente na propriedade components do objeto do export default. Seu código do script deve ficar assim:

<script lang="ts">
import { obterCategorias } from "@/http/index";
import type ICategoria from "@/interfaces/ICategoria";
import CardCategoria from "./CardCategoria.vue";

export default {
  data() {
    return {
      categorias: [] as ICategoria[],
    };
  },
  async created() {
    this.categorias = await obterCategorias();
  },
  components: { CardCategoria } // adicionado
};
</script>

Com isso, o componente poderá ser utilizado corretamente.

Espero ter ajudado. Abraços e bons estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software