1
resposta

Erro ao renomear componente.

Eu havia criado um componente chamado "imagemResponsiva" e feito sua importação no App.vue. Para padronizar os nomes dos componentes, eu mudei seu nome para ImagemResponsiva (agora iniciando com letra maiúscula) e fiz a alteração na importação.

No entanto, agora aparece a seguinte mensagem de erro no VS Code:

    Already included file name 'd:/Programação/Projetos/alurapic/src/components/shared/imagem-responsiva/ImagemResponsiva.vue' differs from file name 'd:/Programação/Projetos/alurapic/src/components/shared/imagem-responsiva/imagemResponsiva.vue' only in casing.
  The file is in the program because:
    Imported via './components/shared/imagem-responsiva/ImagemResponsiva.vue' from file 'd:/Programação/Projetos/alurapic/src/App.vue'
    Root file specified for compilation
    Root file specified for compilation

A página não é carregada e aparece o seguinte erro no navegador:

Failed to compile.

./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-7ba5bd90","hasScoped":false,"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/App.vue
(Emitted value instead of an instance of Error) 
  Error compiling template:

  <div class="corpo">
    <h1 class="centralizado">{{titulo}}</h1>

    <input type="search" class="filtro" v-on:input="filtro = $event.target.value" placeholder="filtre por parte do filto"> <!-- "v-on:input" no envento input executa o código: pega o valor (value) de quem disparou o evento (target, que é o input) -->
    <ul class="lista-fotos">
      <li class="lista-fotos-item" v-for="foto of fotosComFiltro" :key="foto.id">

        <meu-painel :titulo="foto.titulo">
          <imagem-responsiva :url="foto.url" :titulo="foto.titulo">  <!-- Inserida dentro da tag slot, presente em Painel.vue -->
        </meu-painel>

      </li>
    </ul>

  </div>


  - tag <imagem-responsiva> has no matching end tag.

 @ ./src/App.vue 11:0-238
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

Tentei retornar o nome do arquivo ao original, mas o erro persiste. Poderia me ajudar, por favor? Obrigado.

1 resposta
O post foi fechado pois o curso foi descontinuado e não faz mais parte da grade oficial. Bons Estudos!