Как поставить vue-owl-carousel в nuxt.js?

258

29 марта 2019, 03:30

Сделал все по инструкции

import Carousel from 'vue-owl-carousel'
сomponents: { Carousel }

В итоге ошибка компонент не найден

Нигде не могу найти нужную информацию, как это реализовать? Заранее большое спасибо!

Answer 1

import carousel from 'vue-owl-carousel'
export default {
    components: { carousel },
}

Попробуй carousel c маленькой буквы написать как в инструкции

Answer 2

Нашел решение.

<carousel v-if="isNuxtReady">
  <img src="https://placeimg.com/200/200/any?1">
  <img src="https://placeimg.com/200/200/any?2">
  <img src="https://placeimg.com/200/200/any?3">
  <img src="https://placeimg.com/200/200/any?4">
</carousel>
<script>
  const carousel = () => window && window !== undefined ? import("vue-owl-carousel") : null;
  export default {
    components: { carousel },
    data() {
      return {
        isNuxtReady: false,
     }
    },
    mounted() {
      const vm = this;
      if (process.browser) {
        window.onNuxtReady(app => {
          console.log("Nuxt ready!");
          vm.isNuxtReady = true;
        });
      }
    },
  }
</script>