使用 import.meta.glob 可以实现动态批量引入文件

首先要了解 import.meta.glob

• 这只是一个 Vite 独有的功能而不是一个 Web 或 ES 标准
• 该 Glob 模式会被当成导入标识符：必须是相对路径（以 ./ 开头）或绝对路径（以 / 开头，相对于项目根目录解析）。
• Glob 匹配是使用 fast-glob 来实现的 —— 阅读它的文档来查阅 支持的 Glob 模式。
• 你还需注意，glob 的导入不接受变量，你应直接传递字符串模式。
• glob 模式不能包含与包裹引号相同的引号字符串（其中包括 '，"，```），例如，如果你想实现 '/Tom\'s files/**' 的效果，请使用 "/Tom's files/**" 代替。
• 【这段文字说明的出处：链接：www.jianshu.com/p/0d7a170c5…

代码案例

以下是我写的一段代码案例：功能是从当前目录下引入文件名为xxxConfig.vue这样的所有文件，然后把这些文件都引入到vue到defineComponents中，这样就可以方便使用vue的动态组件 ，后续凡是增加相应的组件的话，就只需要按照这个xxxConfig.vue命名规则在目录下新建组件就行了，不需要再手动取把组件往defineComponents的component里一个一个添加了

const files = import.meta.glob('./*Config.vue', { eager: true })
const configComponents:any = {}
for (const fKey of Object.keys(files)) {
  const fileNames = fKey.match(/\.\/(\S*)\.vue/)
  const fileName = Array.isArray(fileNames) && fileNames.length > 1 ? fileNames[1] : ''
  const fildMoudle = files[fKey] as any
  if (fileName && 'default' in fildMoudle) {
    configComponents[fileName] = fildMoudle.default
  }
}

defineComponents({
    name:'my-component',
    components:configComponents
})