Ionic 5 Angular迁移ion-slides到Swiper.js报错如何解决

• 第一个swiper不是已知元素报错的核心原因：Angular模块作用域隔离，你仅在AppModule导入了SwiperModule，但GalleryComponent不在AppModule的declarations数组中（一般是在子功能模块/懒加载模块中），无法访问AppModule导入的组件。
• 第二个SwiperComponent被两个模块同时声明报错的核心原因：SwiperComponent是SwiperModule内部声明的组件，Angular禁止同一个组件被多个NgModule声明，你手动将它加入自己模块的declarations属于错误操作。

1. 先移除错误配置 #

删除你添加到当前模块declarations数组中的SwiperComponent相关代码，第三方模块导出的组件不允许自行声明。

2. 正确导入SwiperModule #

根据你的项目模块结构二选一操作：

• 如果GalleryComponent直接声明在AppModule中：确认AppModule的declarations数组已经包含GalleryComponent，现有配置无需调整，直接清理缓存重启项目即可。
• 如果GalleryComponent声明在子模块（如独立的Gallery模块、其他功能模块、懒加载模块）中：在该子模块的imports数组中导入SwiperModule，代码如下：

// 你的子模块文件，比如gallery.module.ts
import { SwiperModule } from 'swiper/angular';

@NgModule({
  declarations: [GalleryComponent],
  imports: [
    // 其他现有导入
    SwiperModule
  ]
})
export class GalleryModule {}

3. 清理缓存重启开发服务 #

修改完成后如果依然报错，执行以下命令清理缓存后重新启动：

# 清理Angular缓存
ng cache clean
# 重启服务
ng serve

如果还是不行，可以删除node_modules下的.cache文件夹后再启动。

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