Refactor ProjectSwitcherBar import to use defineAsyncComponent for improved performance in multiple layout files.

Author: jaydrogers

docs/layouts/docs.vue

@@ -26,7 +26,11 @@
 </template>
 
 <script setup>
-import { ProjectSwitcherBar } from '@serversideup/project-switcher-bar'
+import { defineAsyncComponent } from 'vue'
+
+const ProjectSwitcherBar = defineAsyncComponent(() =>
+  import('@serversideup/project-switcher-bar').then(m => m.ProjectSwitcherBar)
+)
 
 useHead({
     htmlAttrs: {

docs/layouts/examples.vue

@@ -26,7 +26,11 @@
 </template>
 
 <script setup>
-import { ProjectSwitcherBar } from '@serversideup/project-switcher-bar'
+import { defineAsyncComponent } from 'vue'
+
+const ProjectSwitcherBar = defineAsyncComponent(() =>
+  import('@serversideup/project-switcher-bar').then(m => m.ProjectSwitcherBar)
+)
 
 useHead({
     htmlAttrs: {

docs/layouts/marketing.vue

@@ -27,7 +27,11 @@
 </template>
 
 <script setup>
-import { ProjectSwitcherBar } from '@serversideup/project-switcher-bar'
+import { defineAsyncComponent } from 'vue'
+
+const ProjectSwitcherBar = defineAsyncComponent(() =>
+  import('@serversideup/project-switcher-bar').then(m => m.ProjectSwitcherBar)
+)
 
 useHead({
     htmlAttrs: {