✨ feat(theme): enhance Vite configuration and add additional theme styles

Author: danhnguyen

docs/.vitepress/config.ts

@@ -16,6 +16,13 @@ export default defineConfig({
     ssr: {
       noExternal: ['vitepress'],
     },
+    build: {
+      rollupOptions: {
+        output: {
+          manualChunks: undefined,
+        },
+      },
+    },
   },
 
   // Ensure CSS is properly included

docs/.vitepress/theme/index.js

@@ -1,5 +1,15 @@
 // .vitepress/theme/index.js
 import DefaultTheme from 'vitepress/theme';
+import 'vitepress/dist/client/theme-default/styles/fonts.css';
+import 'vitepress/dist/client/theme-default/styles/vars.css';
+import 'vitepress/dist/client/theme-default/styles/base.css';
+import 'vitepress/dist/client/theme-default/styles/utils.css';
+import 'vitepress/dist/client/theme-default/styles/icons.css';
+import 'vitepress/dist/client/theme-default/styles/components/custom-block.css';
+import 'vitepress/dist/client/theme-default/styles/components/vp-code.css';
+import 'vitepress/dist/client/theme-default/styles/components/vp-code-group.css';
+import 'vitepress/dist/client/theme-default/styles/components/vp-doc.css';
+import 'vitepress/dist/client/theme-default/styles/components/vp-sponsor.css';
 import './style.css';
 
 export default DefaultTheme;

docs/.vitepress/theme/style.css

@@ -1,15 +1,3 @@
-/* Import all VitePress theme CSS files that exist */
-@import 'vitepress/dist/client/theme-default/styles/fonts.css';
-@import 'vitepress/dist/client/theme-default/styles/vars.css';
-@import 'vitepress/dist/client/theme-default/styles/base.css';
-@import 'vitepress/dist/client/theme-default/styles/utils.css';
-@import 'vitepress/dist/client/theme-default/styles/icons.css';
-@import 'vitepress/dist/client/theme-default/styles/components/custom-block.css';
-@import 'vitepress/dist/client/theme-default/styles/components/vp-code.css';
-@import 'vitepress/dist/client/theme-default/styles/components/vp-code-group.css';
-@import 'vitepress/dist/client/theme-default/styles/components/vp-doc.css';
-@import 'vitepress/dist/client/theme-default/styles/components/vp-sponsor.css';
-
 /* Custom theme overrides */
 :root {
   --vp-c-brand-1: #3c82f6;

examples/src/views/Home.vue

@@ -1,9 +1,8 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
-import { GeolocateControls, Mapbox } from '@libs/components';
 import { useMapbox } from '@libs/composables';
-import { type MapOptions } from 'vue3-mapbox';
-import 'vue3-mapbox/dist/style.css';
+import { type MapOptions, GeolocateControls, Mapbox } from 'vue3-maplibre-gl';
+import 'vue3-maplibre-gl/dist/style.css';
 
 const options = computed<MapOptions>(() => ({
   container: 'map',

package.json

@@ -69,7 +69,8 @@
   },
   "dependencies": {
     "maplibre-gl": "^4.3.2",
-    "vue": "^3.4.27"
+    "vue": "^3.4.27",
+    "vue3-maplibre-gl": "^3.2.0"
   },
   "peerDependencies": {
     "vue": "^3.0.0"

yarn.lock

@@ -3253,6 +3253,14 @@ vue-tsc@^2.0.19:
     "@volar/typescript" "2.4.15"
     "@vue/language-core" "2.2.12"
 
+vue3-maplibre-gl@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/vue3-maplibre-gl/-/vue3-maplibre-gl-3.2.0.tgz#1503faf9850eb23446d531751b4b219fc196cb34"
+  integrity sha512-+aficvPPwyUO6LQGjzh0IlEr0udUckTrqGSeHYKJ6v4+jXNKPnnWKRptgNfI39YK9jkwtMZO0FCyfBzFT4wHdQ==
+  dependencies:
+    maplibre-gl "^4.3.2"
+    vue "^3.4.27"
+
 vue@^3.4.27, vue@^3.5.13:
   version "3.5.17"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.5.17.tgz#ea8a6a45abb2b0620e7d479319ce8434b55650cf"