From 0b0b695ab9c0050d09bf37e67ada4776c386e779 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ond=C5=99ej=20Mis=C3=A1k?= <email@ondrejmisak.cz>
Date: Mon, 23 Jan 2023 12:30:54 +0100
Subject: [PATCH] Separating Swiper into chunks from entry bundle

Swiper is a relatively large library. When compiling Nuxt, it increases the main entry.js by about 200kb, entry.css by about 100kb. With this modification, swiper will be separated into its own chunk, improving the loading speed of the application.
---
 src/module.ts | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/module.ts b/src/module.ts
index 0455fc1..bbea8fe 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -2,7 +2,8 @@ import * as swiper from 'swiper'
 import {
   defineNuxtModule,
   addPluginTemplate,
-  addImports
+  addImports,
+  extendViteConfig
 } from '@nuxt/kit'
 import { name, version } from '../package.json'
 
@@ -36,6 +37,19 @@ export default defineNuxtModule<SwiperModuleOptions>({
       }
     ]
 
+    // Separating Swiper into chunks from Nuxt entry bundle
+    extendViteConfig((viteConfig) => {
+      if (viteConfig.build?.rollupOptions?.manualChunks) {
+        return
+      }
+
+      viteConfig.build!.rollupOptions!.manualChunks = function (id) {
+        if (id.includes('/node_modules/swiper')) {
+          return `vendor-swiper`
+        }
+      }
+    })
+
     // Import Each Swiper Module & CSS if it exists.
     for (const [key, _] of Object.entries(swiper)) {
       // Turn key to snake-case.