From cbe5f6886c620c5a63f0ca4fac3e49c26a01566f Mon Sep 17 00:00:00 2001
From: Daniel Castellon <dan.a.castellon@gmail.com>
Date: Tue, 7 Aug 2018 12:14:23 -0400
Subject: [PATCH] (perf): dynamically import swiper to reduce client bundle
 size

---
 .../client/templates/cartDrawer/cartDrawer.js | 34 ++++++++++++-------
 1 file changed, 21 insertions(+), 13 deletions(-)

diff --git a/imports/plugins/core/checkout/client/templates/cartDrawer/cartDrawer.js b/imports/plugins/core/checkout/client/templates/cartDrawer/cartDrawer.js
index 7de860bee18..a5870251a99 100644
--- a/imports/plugins/core/checkout/client/templates/cartDrawer/cartDrawer.js
+++ b/imports/plugins/core/checkout/client/templates/cartDrawer/cartDrawer.js
@@ -1,5 +1,5 @@
-import Swiper from "swiper";
 import { Components } from "@reactioncommerce/reaction-components";
+import Logger from "@reactioncommerce/logger";
 import { $ } from "meteor/jquery";
 import { Session } from "meteor/session";
 import { Template } from "meteor/templating";
@@ -48,18 +48,26 @@ Template.openCartDrawer.onRendered(() => {
 
   $("#cart-drawer-container").fadeIn(() => {
     if (!swiper) {
-      swiper = new Swiper(".cart-drawer-swiper-container", {
-        direction: "horizontal",
-        setWrapperSize: true,
-        loop: false,
-        grabCursor: true,
-        slidesPerView: "auto",
-        wrapperClass: "cart-drawer-swiper-wrapper",
-        slideClass: "cart-drawer-swiper-slide",
-        slideActiveClass: "cart-drawer-swiper-slide-active",
-        pagination: ".cart-drawer-pagination",
-        paginationClickable: true
-      });
+      import("swiper")
+        .then((module) => {
+          const Swiper = module.default;
+          swiper = new Swiper(".cart-drawer-swiper-container", {
+            direction: "horizontal",
+            setWrapperSize: true,
+            loop: false,
+            grabCursor: true,
+            slidesPerView: "auto",
+            wrapperClass: "cart-drawer-swiper-wrapper",
+            slideClass: "cart-drawer-swiper-slide",
+            slideActiveClass: "cart-drawer-swiper-slide-active",
+            pagination: ".cart-drawer-pagination",
+            paginationClickable: true
+          });
+          return swiper;
+        })
+        .catch((error) => {
+          Logger.error(error.message, "Unable to load Swiper module");
+        });
     }
   });
 });