Angular 15集成Swiper 9编译报错TS2430求助

方案1：添加类型声明补丁（推荐） #

这是最稳妥的解决方式，直接修正Swiper的类型定义冲突：

• 在项目src目录下新建types/swiper.d.ts文件
• 写入以下代码覆盖冲突的事件类型：

declare module 'swiper/element' {
  interface SwiperContainerEventMap extends Omit<HTMLElementEventMap, 'click'> {
    click: CustomEvent<any>;
  }
}

• 打开tsconfig.json，确保include数组包含这个类型文件：

{
  "include": [
    "src/**/*",
    "src/types/**/*.d.ts"
  ]
}

• 重启ng serve即可生效

方案2：降级Swiper版本 #

如果不想折腾类型定义，可以直接回退到没有类型冲突的旧版本：

• 卸载当前版本：npm uninstall swiper
• 安装9.2.0版本：npm install swiper@9.2.0
• 重新启动项目验证

方案3：临时放宽TypeScript检查（不推荐） #

这个方法会降低代码类型安全性，仅作为应急选项：

• 编辑tsconfig.json，修改编译器配置：

{
  "compilerOptions": {
    "strict": false,
    "strictFunctionTypes": false
  }
}

• 保存后重启ng serve

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