Merge pull request #4157 from gibkigonzo/bugfix/lazy-load-carousel

add lazy load for vue-carousel

Author: pkarw

CHANGELOG.md

@@ -39,6 +39,7 @@ Remove preload font - it gives good performance, but vue-meta refresh page, beca
 - Add onlyPositive prop to BaseInputNumber to not allow user type negative value - @Michal-Dziedzinski (#4136)
 - Await for cart/authorize while login user - @gibkigonzo (#4133)
 - Fixed `NOT_ALLOWED_SSR_EXTENSIONS_REGEX` to only match with file extensions having a dot - @haelbichalex (#4100)
+- Add lazy load for vue-carousel - @gibkigonzo (#4157)
 
 ## [1.11.1] - 2020.02.05
 

src/themes/default/components/core/ProductGalleryCarousel.vue

@@ -45,7 +45,6 @@
 
 <script>
 import config from 'config'
-import { Carousel, Slide } from 'vue-carousel'
 import ProductImage from './ProductImage'
 import ProductVideo from './ProductVideo'
 import reduce from 'lodash-es/reduce'
@@ -54,8 +53,8 @@ import map from 'lodash-es/map'
 export default {
   name: 'ProductGalleryCarousel',
   components: {
-    Carousel,
-    Slide,
+    'Carousel': () => import('vue-carousel').then(Slider => Slider.Carousel),
+    'Slide': () => import('vue-carousel').then(Slider => Slider.Slide),
     ProductImage,
     ProductVideo
   },

src/themes/default/components/core/ProductGalleryZoomCarousel.vue

@@ -51,7 +51,6 @@
 </template>
 
 <script>
-import { Carousel, Slide } from 'vue-carousel'
 import { disableBodyScroll, clearAllBodyScrollLocks } from 'body-scroll-lock'
 import ProductImage from './ProductImage'
 import ProductVideo from './ProductVideo'
@@ -81,8 +80,8 @@ export default {
     }
   },
   components: {
-    Carousel,
-    Slide,
+    'Carousel': () => import('vue-carousel').then(Slider => Slider.Carousel),
+    'Slide': () => import('vue-carousel').then(Slider => Slider.Slide),
     ProductImage,
     ProductVideo
   },