No swiper.css

BUG REPORT TEMPLATE

Vue.js version and component version

@vue/cli: 4.4.1 swiper: 6.0.4 vue-awesome-swiper: 4.1.1

Reproduction

I think everywhere, just install with npm install swiper vue-awesome-swiper --save

What is Expected?

No error when compile.

What is actually happening?

ERROR  Failed to compile with 1 errors

This dependency was not found:

* swiper/css/swiper.css 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/lib??vue-loader-options!./src/components/setting-box-carousel/SettingBoxCarousel.vue?vue&type=script&lang=js&

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

And in node_modules/swiper/ there isn’t any cssfolder.

---

EDIT: I found a (temporary?) solution. I use import 'swiper/swiper-bundle.css' in my scss file.

EDIT2: As @Charlie50503 said, use import "swiper/swiper-bundle.min.css";.

[ygj6]

From the official README document, we can see :

Global Registration

import Vue from 'vue'
import VueAwesomeSwiper from 'vue-awesome-swiper'

// import style (>= Swiper 6.x)
import 'swiper/swiper-bundle.css'

// import style (<= Swiper 5.x)
import 'swiper/css/swiper.css'

Vue.use(VueAwesomeSwiper, /* { default options with global component } */)

Local Registration

import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'

// import style (>= Swiper 6.x)
import 'swiper/swiper-bundle.css'

// import style (<= Swiper 5.x)
import 'swiper/css/swiper.css'

export default {
  components: {
    Swiper,
    SwiperSlide
  },
  directives: {
    swiper: directive
  }
}

[aaroncdx]

can help me with this? i even cant read the plugin in my nuxt project.

ps: please update the doc.