SSENSE / vue-carousel

A flexible, responsive, touch-friendly carousel for Vue.js
https://ssense.github.io/vue-carousel/
MIT License
1.72k stars 504 forks source link

gridsome build error #569

Open nothinghalosix opened 3 years ago

nothinghalosix commented 3 years ago

(node:99081) UnhandledPromiseRejectionWarning: TypeError: Cannot read property '__esModule' of undefined

at Re (/Users/nothing/sites/designfabrik/node_modules/vue/dist/vue.runtime.common.prod.js:6:24223)
at /Users/nothing/sites/designfabrik/node_modules/vue/dist/vue.runtime.common.prod.js:6:21188
at /Users/nothing/sites/designfabrik/node_modules/vue/dist/vue.runtime.common.prod.js:6:2394
aleksanderwalczuk commented 3 years ago

@nothinghalosix were you able to resolve this issue? I cannot build this with Gridsome

nothinghalosix commented 3 years ago

try this in your script

export default { components: { Carousel: () => import("vue-carousel") .then((m) => m.Carousel) .catch(), Slide: () => import("vue-carousel") .then((m) => m.Slide) .catch(), },

aleksanderwalczuk commented 3 years ago

Thanks for that, I actually solved it by setting a client only condition.

added as plugin in main.js

  if (process.isClient) {
      Vue.use(require("vue-carousel").default);
}

in template file

<ClientOnly>
  <carousel>
    <slide>slide 1</slide>
  <carousel>
</ClientOnly>
a-kriya commented 2 years ago

Registering as a plugin did not work for me, but registering individual components in main.js fixed the builds for me:

if (process.isClient) {
  Vue.component('Carousel', require('vue-carousel').Carousel)
  Vue.component('Slide', require('vue-carousel').Slide)
}

In the last few days, my Gridsome builds started erroring out. I was registering per-component earlier as @nothinghalosix shared. I do not know what the difference is with registering in main.js with isClient check but it has fixed my issue.