Chaning to a provider system for desktop and web variants

package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "dev": "vite dev",
     "build": "vite build",
+    "build:desktop": "VITE_DESKTOP=1 vite build --outDir out-desktop/",
     "preview": "vite preview",
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
@@ -30,6 +31,7 @@
     "svelte-check": "^4.0.0",
     "tailwindcss": "^4.0.0-beta.9",
     "typescript": "^5.0.0",
-    "vite": "^5.4.11"
+    "vite": "^5.4.11",
+    "vite-plugin-wasm": "^3.4.1"
   }
 }

src/lib/CodeEditor.svelte

@@ -5,7 +5,7 @@
 	import {} from 'sprig/web';
 	import { constrainedEditor } from 'constrained-editor-plugin';
 	import { parse } from '@babel/parser';
-	import { buildProject } from './build';
+	import { buildProject } from './build/esbuild';
 
 	let editorContainer: HTMLDivElement;
 	let editor: import('monaco-editor').editor.IStandaloneCodeEditor;

src/lib/build/esbuild.ts

@@ -1,13 +1,13 @@
 import { transform, initialize } from 'esbuild-wasm';
 
 await initialize({
-	wasmURL: (await import('esbuild-wasm/esbuild.wasm')).default
+	wasmURL: (await import('esbuild-wasm/esbuild.wasm?url')).default
 });
 
 export async function buildProject(code: string, vanilla: boolean) {
 	let template = '';
 	if (vanilla) {
-		template += `function game(api) {
+		template += `async function game(api) {
 ${code}
 }
 console.log("Made with Sprigsy")
@@ -18,6 +18,6 @@ game({ addSprite, addText, afterInput, bitmap, clearInterval, clearText, clearTi
 	}
 
 	return await transform(template, {
-		loader: 'ts'
+		loader: 'ts',
 	});
 }

src/lib/provider/Provider.ts

@@ -0,0 +1,30 @@
+import { buildProject } from "$lib/build/esbuild"
+
+enum Capability {
+    BuildToVite,
+    ProjectDB
+}
+
+export default abstract class Provider {
+    constructor(
+        
+    ) {
+        
+    }
+
+    abstract capabilities(): Capability[]
+
+    /**
+     * Builds HTML project
+     */
+    async buildHTML(input: string): Promise<string> {
+        throw new TypeError("BuildToVite capability is not available")
+    }
+
+    /**
+     * Build JS
+     */
+    async buildJS(input: string): Promise<string> {
+        return (await buildProject(input, true)).code
+    }
+}

src/routes/+layout.ts

@@ -1 +1,2 @@
-export const csr = true;
+export const csr = true;
+export const prerender = true;

vite.config.ts

@@ -2,5 +2,8 @@ import { sveltekit } from '@sveltejs/kit/vite';
 import { defineConfig } from 'vite';
 
 export default defineConfig({
-	plugins: [sveltekit()]
+	plugins: [sveltekit()],
+	build: {
+		target: ['es2022']
+	}
 });