
当在 TypeScript 项目中使用 import.meta.glob() 并传入 { eager: true } 等选项时,出现 “Object literal may only specify known properties” 类型错误,根本原因是 TypeScript 未正确识别 Vite 提供的增强类型声明。
当在 typescript 项目中使用 `import.meta.glob()` 并传入 `{ eager: true }` 等选项时,出现 “object literal may only specify known properties” 类型错误,根本原因是 typescript 未正确识别 vite 提供的增强类型声明。
Vite 通过扩展 import.meta 对象提供了 glob 方法,支持动态导入匹配文件(如 ./mdx/*.mdx),并允许传入 eager、as、query 等配置选项。但这些类型定义并非内置于 TypeScript,而是由 Vite 自带的类型声明文件 vite/client 提供。若项目未显式启用该类型库,TypeScript 将仅将 import.meta.glob 视为一个无参数签名的泛型函数,导致所有选项(如 eager: true)被判定为非法属性。
✅ 正确做法是:在项目根目录的 tsconfig.json 中,将 "vite/client" 显式加入 compilerOptions.types 数组:
{
"compilerOptions": {
"types": ["vite/client"]
}
}
⚠️ 注意事项:
- 修改后必须重启 TypeScript 服务或 IDE(如 VS Code 中可通过 Ctrl+Shift+P → “TypeScript: Restart TS server” 触发);
- 若项目已存在 types 字段,请追加而非覆盖,例如:"types": ["node", "vite/client"];
- 确保已安装 vite 作为开发依赖(npm install -D vite),否则 vite/client 类型不可用;
- vite/client 类型包随 Vite 安装自动提供,无需单独安装 @types/vite。
配置生效后,以下代码将通过类型检查,并按预期工作:
// ✅ 正确:eager 模式同步导入所有 .mdx 文件
const posts = import.meta.glob('./mdx/*.mdx', { eager: true });
// ✅ 正确:以字符串形式读取内容(适用于 Markdown 原文处理)
const rawFiles = import.meta.glob('./content/**/*.md', { as: 'raw' });
// ✅ 正确:导入为默认导出的组件(常用于路由组件自动注册)
const routes = import.meta.glob('./pages/**/*.{vue,ts}', { eager: true, import: 'default' });
? 补充说明:import.meta.glob() 的返回值类型为 Record
总结:这不是 Vite 功能失效,而是 TypeScript 类型环境配置缺失。只需一行 types 配置 + IDE 重启,即可解锁完整的 Glob Import 类型支持与开发体验。










