找不到此依赖项：*swiper/vue 如何修复？

Question

I'm scratching my head because I ran npm i swiper and read through the Swiper Vue docs and it says to import { Swiper, SwiperSlide } from 'swiper/vue which I've done and I even get the bundle size showing 95.4K (gzipped: 28.9K) .

When I run npm run serve I then get this error

This dependency was not found:

* swiper/vue in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/views/Home.vue?vue&type=script&lang=js

To install it, you can run: npm install --save swiper/vue

I for the life of me cannot figure out how to import that dependency.

Answer 1

This worked for me, using Vue ^3.0.0 and Swiper ^8.0.6

import { Swiper, SwiperSlide } from "swiper/vue/swiper-vue";

import "swiper/swiper-bundle.css";

Answer 2

If you're using the swiper version 7* then you could face this type of issue.

Github issue 4871

Try downgrading to the v6.7.5, see if that helps.

Related issue