vue-carousel icon indicating copy to clipboard operation
vue-carousel copied to clipboard

gridsome build error

Open nothinghalosix opened this issue 3 years ago • 4 comments

(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

nothinghalosix avatar May 08 '21 15:05 nothinghalosix

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

aleksanderwalczuk avatar Sep 26 '21 11:09 aleksanderwalczuk

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(), },

nothinghalosix avatar Sep 28 '21 08:09 nothinghalosix

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>

aleksanderwalczuk avatar Sep 28 '21 21:09 aleksanderwalczuk

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.

a-kriya avatar Dec 02 '21 16:12 a-kriya