Unable to import multiple components.

hugopedro commented 1 year ago

Describe the bug

<template>
 <div>
    <Navbar />
      <SSHDStepper />
      <CNPJStepper />
</div>
 </template>

<script setup lang="ts">
</script>

Output:

runtime-core.esm-bundler.js:40 [Vue warn]: Failed to resolve component: CNPJStepper
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< null > > 
  at <RouterView> 
  at <App>

SSHDStepper is loaded normally, CNPJStepper isn't.

Looking inside components.d.ts I found something intriguing:

// generated by unplugin-vue-components
// We suggest you to commit this file into source control
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'

export {}

declare module '@vue/runtime-core' {
  export interface GlobalComponents {
    CalendarErrorModal: typeof import('./src/components/CalendarErrorModal.vue')['default']
    'CNPJStepper ': typeof import('./src/components/CNPJStepper .vue')['default']
    Navbar: typeof import('./src/components/Navbar.vue')['default']
    RouterLink: typeof import('vue-router')['RouterLink']
    RouterView: typeof import('vue-router')['RouterView']
    SSHDStepper: typeof import('./src/components/SSHDStepper.vue')['default']
    ThirdPartyPersonTable: typeof import('./src/components/Detailings/Tables/ThirdPartyPersonTable.vue')['default']
  }
}

The component is accompanied by single quotes and a space before mentioning the file type.

Editing this call and leaving It same as others didn't work.

Reproduction

It happens when the component was called within the application

System Info

System:
    OS: Linux 5.4 Linux Mint 19.3 (Tricia)
    CPU: (2) x64 Intel(R) Pentium(R) CPU G3420 @ 3.20GHz
    Memory: 703.84 MB / 7.65 GB
    Container: Yes
    Shell: 5.4.2 - /usr/bin/zsh
  Binaries:
    Node: 14.15.0 - ~/.nvm/versions/node/v14.15.0/bin/node
    Yarn: 1.22.11 - /usr/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v14.15.0/bin/npm
  Browsers:
    Chrome: 109.0.5414.74
    Firefox: 105.0.3

Used Package Manager

npm

Validations

[X] Follow our Code of Conduct
[X] Read the Contributing Guide.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
[X] The provided reproduction is a minimal reproducible of the bug.

Sight-wcg commented 1 year ago

CNPJStepper .vue --> CNPJStepper.vue

lishaobos commented 1 year ago

CNPJStepper .vue --> CNPJStepper.vue

hi, Did you resolved it?

Sight-wcg commented 1 year ago

CNPJStepper .vue --> CNPJStepper.vue

hi, Did you resolved it?

I guess the file name is wrong.

export interface GlobalComponents {
    CalendarErrorModal: typeof import('./src/components/CalendarErrorModal.vue')['default']
    'CNPJStepper ': typeof import('./src/components/CNPJStepper .vue')['default']
    ...

unplugin / unplugin-vue-components