14-vite的 global-import批量引入文件功能

📅 发布时间:2026/7/15 5:20:23 👁️ 浏览次数:
14-vite的 global-import批量引入文件功能
vite的global-import 批量导入功能功能使用正则表达式来引入一组js文件而不是一个js文件举例// 有一个 gloabl 文件夹里面有 a.js a.json b.js b.json test-1.js// 内容都是很简单的内容constglobalModuleimport.meta.glob(./glob/*)Object.entries(globalModule).forEach(([k,v]){v().then((m)console.log(k:m.default))})/** 打印结果 ./glob/a.js:a ./glob/a.json:[object Object] ./glob/b.js:b ./glob/b.json:[object Object] ./glob/test-1.js:test-1 */使用场景多语言支持在某个文件夹下面有一些语法文件后来我们又新增一些相同格式的语言文件注意const globalModule import.meta.glob(‘./glob/*’)上面的 * 号可以跟 *.js,表示仅取 js 文件 或者 *.json 仅表示 JSON 文件可以这样选取文件 import.meta.glob(‘./glob/*-[1-9].js’) 表示仅取 test-1.js 文件不是 es 的标准是 vite 提供的功能编译情况其他用法编译情况// 编译前constglobalModule1import.meta.glob(./glob/*-[1-9].js)// 编译后constglobalModule1/* #__PURE__ */Object.assign({./glob/test-1.js:()import(/src/glob/test-1.js)})上面是异步引入我们后续想要得到模块具体的方法还要通过.then我们还可以直接使用 globEager, 在编译时就已经把代码引入, 目前测试看这块的 api 报错了constglobalModule2import.meta.globEager(./glob/*)console.log(ccc,globalModule2);