Vue version

3.3.4

Link to minimal reproduction

https://github.com/josh-eebz/Nuxt-Dynamic-Component-Import

Steps to reproduce

Nuxt auto-imported components requires camel-case. However, using dynamic components (component :is) renders components in lowercase.

What is expected?

Dynamic components allows Nuxt to auto-import components.

What is actually happening?

Components aren't rendering.

System Info

System:
    OS: macOS 12.5
    CPU: (8) arm64 Apple M1
    Memory: 83.86 MB / 8.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 20.3.1 - ~/.nvm/versions/node/v20.3.1/bin/node
    npm: 9.7.2 - ~/.nvm/versions/node/v20.3.1/bin/npm
  Browsers:
    Chrome: 114.0.5735.248
    Safari: 15.6

Any additional comments?

No response

I don't think this is a bug. From the compilation results, auto-import only imports related components during compilation, while DynamicComponent obtains components from the parameters of the render function. The difference between the two leads to different usage methods, especially In the option api, you need to define a variable so that DynamicComponent can get the component in the render function

<template>
  Dynamic Import
  <!-- Not working -->
  <br />
  <component :is="GroupTest" />
  <br />
  Manual Import
  <br />
  <!-- Working -->
  <grouptest />
  <br />
  Nuxt Import
  <br />
  <GroupTest />
</template>

<script>
import grouptest from '@/components/group/test';

export default {
  components: {
    grouptest,
  },
  data(){
    return {
      GroupTest: grouptest
    }
  }
};
</script>

Even if this were a bug, you would have to file it with thr nuxt project as Vue core has nothing to do with the auto-import functionality of nuxt.

Thanks for the feedback