Vue3+TS项目yarn安装webdav.client后无法导入ITHit报错

问题分析 #

webdav.client库并非以ES模块的命名导出方式提供ITHit对象，而是将其挂载到全局window对象上，直接用import { ITHit } from 'webdav.client'会触发导出未找到的报错。

解决方案 #

1. 全局引入库文件
   在项目入口文件（如main.ts）中直接引入整个库，完成全局挂载：

import 'webdav.client';

2. 添加TypeScript类型声明
   由于TS无法识别全局挂载的ITHit，需添加类型声明规避类型报错：

• 组件内声明：在使用ITHit的组件顶部添加以下代码：

declare global {
  interface Window {
    ITHit: any; // 若熟悉库的具体API，可替换为更精准的类型定义
  }
}

• 全局声明：在项目的src/vite-env.d.ts或自定义.d.ts文件中添加上述全局声明，实现全项目生效。

3. 调用ITHit对象
   完成上述步骤后，即可在组件中通过window.ITHit调用库的相关方法。

额外排查步骤 #

• 若问题仍存在，尝试重新安装库确保依赖完整：

yarn remove webdav.client
yarn add webdav.client

• 核对库的版本与Vue3 + TS环境的兼容性，可查阅库的官方文档确认正确使用方式。

内容的提问来源于stack exchange，提问作者AlanK