React使用最新版Swiper报错Can't resolve 'swiper' 按官方导入仍无效

• 先执行npm ls swiper确认Swiper已成功安装到当前项目依赖中，若返回空或未依赖提示，删除node_modules文件夹和package-lock.json（yarn用户删除yarn.lock）后重新执行npm i swiper即可。
• 确认你的Swiper版本为v9及以上，你当前使用的导入语法仅适配v9+版本，若使用v8及更低版本，需替换为旧版导入语法：

  import SwiperCore, { Navigation, Pagination, Scrollbar, A11y } from 'swiper';
  import { Swiper, SwiperSlide } from 'swiper/react';
  import 'swiper/swiper-bundle.min.css';
  

• 若使用webpack4或create-react-app@4及更低版本的构建工具，需在webpack配置的resolve.extensions数组中添加.mjs后缀支持，Swiper v9+默认采用ESM规范打包，旧版构建工具默认不识别.mjs后缀会触发解析失败。
• 若使用vite构建，检查vite.config.js中是否配置了错误的alias覆盖了swiper的默认解析路径，删除对应错误配置即可。
• 完成上述操作后重启本地开发服务，清空缓存重新编译即可解决报错。

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