Vue3安装swiper7,安装之后,vue@cli认为swiper不存在

我按照官网上来的,就是这个 Swiper Vue.js Components Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. https://swiperjs.com/vue

$ npm i swiper                                                              

added 3 packages, and audited 1287 packages in 4s

80 packages are looking for funding
  run `npm fund` for details

10 moderate severity vulnerabilities

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.

这是我的代码:

<template>
    <swiper 
        :slides-per-view="3"
        :space-between="50"
        @swiper="onSwiper"
        @slideChange="onSlideChange"
    >
        <swiper-slide>Slide 1</swiper-slide>
        <swiper-slide>Slide 1</swiper-slide>
        <swiper-slide>Slide 1</swiper-slide>
        <swiper-slide>Slide 1</swiper-slide>
    </swiper>
</template>

<script>

import { Swiper, SwiperSlide } from 'swiper/vue'

export default {
    components:{
        Swiper,
        SwiperSlide
    },
    methods:{
        onSwiper:(swiper)=>{
            console.log(swiper)
        },
        onSlideChange:()=>{
            console.log('slide change');
        }
    }
}
</script>

这是报错:

 ERROR  Failed to compile with 1 error                                                    下午4:49:21

This dependency was not found:

* swiper 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/components/FindeSwiper.vue?vue&type=script&lang=js

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