vue3 + vite动态加载组件，打包后失效

项目开发中，需要动态引入并加载组件
刚开始在网上找了很多，大部分都是说使用vite中的glob

const modules = import.meta.glob('./dir/*.js')
compont = modules[key]

这个方法本地就直接没用，然后我又去查找vue3的官网，发现有个异步加载组件的api

import { defineAsyncComponent } from 'vue'

const AsyncComp = defineAsyncComponent(() =>
  import('./components/AsyncComponent.vue')
)

遂使用这个方法，然后成功了，本地没有任何问题。但是后来部署到服务器了之后，组件完全加载不出来，并且会报错

我看着像是组件没有找到，到此为止，因为我是第一次使用vite打包，这时候我开始怀疑是打包出了问题，是不是有什么资源没有打包上，然后查看一番，没有什么问题，才考虑到是否是异步组件问题，网上也找了很多解决办法，但是都是同样的说的第一种办法，但是我自己尝试无果。
这时候查看vite官网，发现glob是相当于批量引入组件，本地无效会不会是组件没有注册，因为本地无效但是也没有报错，线上报错是找不到组件，换句话说就是组件没有引入。这时候我开始尝试使用glob批量引入组件，同时使用defineAsyncComponent异步注册组件

const modules = import.meta.glob('../../components/**/*.vue')
d.component = defineAsyncComponent(modules[`../../${c}.vue`])

至此，本地没有问题，部署上线也ok，记录