Lingallery icon indicating copy to clipboard operation
Lingallery copied to clipboard

Doesn't work with Nuxt

Open danieldanielecki opened this issue 2 years ago • 1 comments

Would be appreciated to have this plugin working with Nuxt, I've tried the setup below and it doesn't work.

plugins/test.js

import Vue from 'vue'
import VueLazyLoad from 'vue-lazyload'
import LightBox from 'vue-image-lightbox'

Vue.use(VueLazyLoad)
Vue.component('lingallery', LightBox)

nuxt.config.js

plugins: [
    { src: '~/plugins/test.js', ssr: false }, // without ssr also doesn't work.
],

component.vue

<template>
  <lingallery
    :width="width"
    :height="height"
    :items="items"
    :media="media"
  />
</template>

<script lang="ts">
import Vue from 'vue'

export default Vue.extend({
  data() {
    return {
      width: 600,
      height: 400,
      items: [
        {
          src: "https://picsum.photos/600/400/?image=0", // for a local file it also doesn't work
          thumbnail: "https://picsum.photos/600/400/?image=0", // for a local file it also doesn't work
          caption: 'Some Caption',
          id: 'someid1',
        },
        {
          src: "https://picsum.photos/600/400/?image=0", // for a local file it also doesn't work
          thumbnail: "https://picsum.photos/600/400/?image=0", // for a local file it also doesn't work
        },
      ],
      media: ['(min-width: 600px)'],
    }
  },
})
</script>

There's nothing in the console and on the page I can simply see an empty page with 1/1 as in the screenshot below. ss

danieldanielecki avatar Oct 02 '21 14:10 danieldanielecki