chore: fix bundling

stores/playground.ts

@@ -1,7 +1,6 @@
 import type { Raw } from 'vue'
 import type { WebContainer, WebContainerProcess } from '@webcontainer/api'
 import type { VirtualFile } from '../structures/VirtualFile'
-import { templates } from '~/templates'
 
 export const PlaygroundStatusOrder = [
   'init',
@@ -31,9 +30,10 @@ export const usePlaygroundStore = defineStore('playground', () => {
   let processInstall: WebContainerProcess | undefined
   let processDev: WebContainerProcess | undefined
 
-  // Mount the playground
+  // Mount the playground on client side
   if (import.meta.client) {
-    ;(async () => {
+    async function mount() {
+      const { templates } = await import('../templates')
       const { files: _files, tree } = await templates.basic({
         nuxtrc: [
           // Have color mode on initial load
@@ -80,7 +80,9 @@ export const usePlaygroundStore = defineStore('playground', () => {
           killPreviousProcess()
         })
       }
-    })()
+    }
+
+    /* #__PURE__ */ mount()
   }
 
   function killPreviousProcess() {

templates/basic.ts

@@ -3,6 +3,9 @@ import type { TemplateOptions } from './types'
 import { filesToWebContainerFs } from './utils'
 
 export default function load(options: TemplateOptions = {}) {
+  if (import.meta.server)
+    throw new Error('This template can only be used on the client')
+
   const rawInput = import.meta.glob([
     './basic/**/*.*',
     './basic/**/.layer-playground/**/*.*',