@nice2dev/game-engine 1.3.15 → 1.3.17

package/dist/esm/export/WebExporter.js

@@ -1,1024 +1,988 @@
-import { TypeScriptExporter } from '../scripting/exporters/TypeScriptExporter.js';
-import { GraphToAST } from '../scripting/GraphToAST.js';
-import { PlatformExporter } from './PlatformExporter.js';
-
-/* ────────────────────────────────────────────────────────────────
-   Web/HTML5 Platform Exporter
-   
-   Base exporter for web-based game engines.
-   Generates HTML, JavaScript/TypeScript, and bundled assets.
-──────────────────────────────────────────────────────────────── */
-/* ── PixiJS Exporter ──────────────────────────────────────────── */
+import { TypeScriptExporter } from "../scripting/exporters/TypeScriptExporter.js";
+import { GraphToAST } from "../scripting/GraphToAST.js";
+import { PlatformExporter } from "./PlatformExporter.js";
 class PixiJSExporter extends PlatformExporter {
-    constructor() {
-        super(...arguments);
-        this.platformId = 'pixijs';
-        this.platformInfo = {
-            id: 'pixijs',
-            name: 'PixiJS',
-            description: 'Fast 2D WebGL renderer',
-            website: 'https://pixijs.com',
-            features: ['2d-rendering', 'particles', 'animation'],
-            supportedAssets: ['sprite', 'tileset', 'audio', 'font', 'script', 'animation'],
-            exportFormats: ['.html', '.js', '.ts'],
-        };
-        this.tsExporter = new TypeScriptExporter();
-        this.graphToAST = new GraphToAST();
+  constructor() {
+    super(...arguments);
+    this.platformId = "pixijs";
+    this.platformInfo = {
+      id: "pixijs",
+      name: "PixiJS",
+      description: "Fast 2D WebGL renderer",
+      website: "https://pixijs.com",
+      features: ["2d-rendering", "particles", "animation"],
+      supportedAssets: ["sprite", "tileset", "audio", "font", "script", "animation"],
+      exportFormats: [".html", ".js", ".ts"]
+    };
+    this.tsExporter = new TypeScriptExporter();
+    this.graphToAST = new GraphToAST();
+  }
+  async doExport(project, options) {
+    const web = options.platformOptions;
+    const useTS = web?.typescript !== false;
+    const bundler = web?.bundler || "vite";
+    this.exportPackageJson(project, web);
+    this.exportIndexHtml(project, options, web);
+    this.exportMainGame(project, options, useTS);
+    this.exportScenes(project, options, useTS);
+    await this.exportScripts(project, options, useTS);
+    this.exportAssetManifest(project);
+    if (bundler !== "none") {
+      this.exportBundlerConfig(project, bundler, useTS);
     }
-    async doExport(project, options) {
-        const web = options.platformOptions;
-        const useTS = web?.typescript !== false;
-        const bundler = web?.bundler || 'vite';
-        // 1. Generate package.json
-        this.exportPackageJson(project, web);
-        // 2. Generate HTML entry
-        this.exportIndexHtml(project, options, web);
-        // 3. Generate main game file
-        this.exportMainGame(project, options, useTS);
-        // 4. Export scenes
-        this.exportScenes(project, options, useTS);
-        // 5. Export scripts
-        await this.exportScripts(project, options, useTS);
-        // 6. Export asset manifest
-        this.exportAssetManifest(project);
-        // 7. Generate bundler config
-        if (bundler !== 'none') {
-            this.exportBundlerConfig(project, bundler, useTS);
-        }
-        // 8. Generate PWA files
-        if (web?.pwa) {
-            this.exportPWAFiles(project);
-        }
-        // 9. Generate utility classes
-        this.exportUtilities(project, useTS);
-        // 10. Generate tsconfig if TypeScript
-        if (useTS) {
-            this.exportTSConfig();
-        }
+    if (web?.pwa) {
+      this.exportPWAFiles(project);
     }
-    exportPackageJson(project, web) {
-        const useTS = web?.typescript !== false;
-        const bundler = web?.bundler || 'vite';
-        const pixiVersion = web?.frameworkVersion || '^8.0.0';
-        const packageJson = {
-            name: project.name.toLowerCase().replace(/\s+/g, '-'),
-            version: project.version,
-            description: project.description || `${project.name} - Built with Nice2Dev`,
-            type: 'module',
-            scripts: {
-                dev: bundler === 'vite'
-                    ? 'vite'
-                    : bundler === 'webpack'
-                        ? 'webpack serve'
-                        : 'parcel index.html',
-                build: bundler === 'vite'
-                    ? 'vite build'
-                    : bundler === 'webpack'
-                        ? 'webpack'
-                        : 'parcel build index.html',
-                preview: bundler === 'vite' ? 'vite preview' : 'serve dist',
-            },
-            dependencies: {
-                pixi: pixiVersion,
-                '@pixi/sound': '^5.0.0',
-            },
-            devDependencies: {
-                ...(useTS ? { typescript: '^5.0.0' } : {}),
-                ...(bundler === 'vite' ? { vite: '^5.0.0' } : {}),
-                ...(bundler === 'webpack'
-                    ? { webpack: '^5.0.0', 'webpack-cli': '^5.0.0', 'webpack-dev-server': '^4.0.0' }
-                    : {}),
-                ...(bundler === 'parcel' ? { parcel: '^2.0.0' } : {}),
-            },
-        };
-        this.addTextFile('package.json', JSON.stringify(packageJson, null, 2));
+    this.exportUtilities(project, useTS);
+    if (useTS) {
+      this.exportTSConfig();
     }
-    exportIndexHtml(project, options, web) {
-        const responsive = web?.responsive !== false;
-        const { width, height } = project.settings.resolution;
-        const html = `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${project.name}</title>
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      box-sizing: border-box;
-    }
-    
-    body {
-      background-color: ${project.settings.backgroundColor};
-      overflow: hidden;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      min-height: 100vh;
-    }
-    
-    #game-container {
-      ${responsive
-            ? `
-      width: 100%;
-      max-width: ${width}px;
-      aspect-ratio: ${width} / ${height};
-      `
-            : `
-      width: ${width}px;
-      height: ${height}px;
-      `}
-    }
-    
-    canvas {
-      display: block;
-      width: 100%;
-      height: 100%;
-      ${project.settings.rendering?.pixelArt ? 'image-rendering: pixelated;' : ''}
-    }
-  </style>
-</head>
-<body>
-  <div id="game-container"></div>
-  <script type="module" src="/src/main.ts"></script>
-</body>
-</html>
-`;
-        this.addTextFile('index.html', html);
+  }
+  exportPackageJson(project, web) {
+    const useTS = web?.typescript !== false;
+    const bundler = web?.bundler || "vite";
+    const pixiVersion = web?.frameworkVersion || "^8.0.0";
+    const packageJson = {
+      name: project.name.toLowerCase().replace(/\s+/g, "-"),
+      version: project.version,
+      description: project.description || `${project.name} - Built with Nice2Dev`,
+      type: "module",
+      scripts: {
+        dev: bundler === "vite" ? "vite" : bundler === "webpack" ? "webpack serve" : "parcel index.html",
+        build: bundler === "vite" ? "vite build" : bundler === "webpack" ? "webpack" : "parcel build index.html",
+        preview: bundler === "vite" ? "vite preview" : "serve dist"
+      },
+      dependencies: {
+        pixi: pixiVersion,
+        "@pixi/sound": "^5.0.0"
+      },
+      devDependencies: {
+        ...useTS ? { typescript: "^5.0.0" } : {},
+        ...bundler === "vite" ? { vite: "^5.0.0" } : {},
+        ...bundler === "webpack" ? { webpack: "^5.0.0", "webpack-cli": "^5.0.0", "webpack-dev-server": "^4.0.0" } : {},
+        ...bundler === "parcel" ? { parcel: "^2.0.0" } : {}
+      }
+    };
+    this.addTextFile("package.json", JSON.stringify(packageJson, null, 2));
+  }
+  exportIndexHtml(project, options, web) {
+    const responsive = web?.responsive !== false;
+    const { width, height } = project.settings.resolution;
+    const html = `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>${project.name}</title>
+  <style>
+    * {
+      margin: 0;
+      padding: 0;
+      box-sizing: border-box;
     }
-    exportMainGame(project, options, useTS) {
-        const { width, height } = project.settings.resolution;
-        const ext = useTS ? 'ts' : 'js';
-        const pixelArt = project.settings.rendering?.pixelArt;
-        const main = `import { Application, Assets } from 'pixi.js';
-import { sound } from '@pixi/sound';
-import { assetManifest } from './assets/manifest${useTS ? '' : '.js'}';
-import { GameManager } from './game/GameManager${useTS ? '' : '.js'}';
-import { loadScene } from './scenes/index${useTS ? '' : '.js'}';
-
-${useTS
-            ? `
-interface GameConfig {
-  width: number;
-  height: number;
-  backgroundColor: number;
-}
-`
-            : ''}
-
-class Game {
-  ${useTS ? 'private app: Application;' : ''}
-  ${useTS ? 'private gameManager: GameManager;' : ''}
-
-  async init()${useTS ? ': Promise<void>' : ''} {
-    // Create PixiJS application
-    this.app = new Application();
-    
-    await this.app.init({
-      width: ${width},
-      height: ${height},
-      backgroundColor: ${this.hexToNumber(project.settings.backgroundColor)},
-      resolution: window.devicePixelRatio || 1,
-      autoDensity: true,
-      ${pixelArt
-            ? `
-      roundPixels: true,
-      antialias: false,`
-            : `
-      antialias: true,`}
-    });
-
-    // Add canvas to DOM
-    const container = document.getElementById('game-container');
-    if (container) {
-      container.appendChild(this.app.canvas);
-    }
-
-    // Load assets
-    await this.loadAssets();
-
-    // Initialize game manager
-    this.gameManager = new GameManager(this.app);
-
-    // Load first scene
-    await loadScene('${project.scenes[0]?.name || 'main'}', this.app, this.gameManager);
-
-    // Start game loop
-    this.app.ticker.add(this.update.bind(this));
-
-    console.log('${project.name} initialized!');
-  }
-
-  private async loadAssets()${useTS ? ': Promise<void>' : ''} {
-    // Register asset bundles
-    await Assets.init({ manifest: assetManifest });
-    
-    // Load all bundles
-    const bundles = assetManifest.bundles.map(b => b.name);
-    await Assets.loadBundle(bundles);
-  }
-
-  private update(ticker${useTS ? ': { deltaTime: number }' : ''})${useTS ? ': void' : ''} {
-    const delta = ticker.deltaTime;
-    this.gameManager.update(delta);
-  }
-}
-
-// Start game
-const game = new Game();
-game.init().catch(console.error);
+    
+    body {
+      background-color: ${project.settings.backgroundColor};
+      overflow: hidden;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      min-height: 100vh;
+    }
+    
+    #game-container {
+      ${responsive ? `
+      width: 100%;
+      max-width: ${width}px;
+      aspect-ratio: ${width} / ${height};
+      ` : `
+      width: ${width}px;
+      height: ${height}px;
+      `}
+    }
+    
+    canvas {
+      display: block;
+      width: 100%;
+      height: 100%;
+      ${project.settings.rendering?.pixelArt ? "image-rendering: pixelated;" : ""}
+    }
+  </style>
+</head>
+<body>
+  <div id="game-container"></div>
+  <script type="module" src="/src/main.ts"><\/script>
+</body>
+</html>
 `;
-        this.addTextFile(`src/main.${ext}`, main);
+    this.addTextFile("index.html", html);
+  }
+  exportMainGame(project, options, useTS) {
+    const { width, height } = project.settings.resolution;
+    const ext = useTS ? "ts" : "js";
+    const pixelArt = project.settings.rendering?.pixelArt;
+    const main = `import { Application, Assets } from 'pixi.js';
+import { sound } from '@pixi/sound';
+import { assetManifest } from './assets/manifest${useTS ? "" : ".js"}';
+import { GameManager } from './game/GameManager${useTS ? "" : ".js"}';
+import { loadScene } from './scenes/index${useTS ? "" : ".js"}';
+
+${useTS ? `
+interface GameConfig {
+  width: number;
+  height: number;
+  backgroundColor: number;
+}
+` : ""}
+
+class Game {
+  ${useTS ? "private app: Application;" : ""}
+  ${useTS ? "private gameManager: GameManager;" : ""}
+
+  async init()${useTS ? ": Promise<void>" : ""} {
+    // Create PixiJS application
+    this.app = new Application();
+    
+    await this.app.init({
+      width: ${width},
+      height: ${height},
+      backgroundColor: ${this.hexToNumber(project.settings.backgroundColor)},
+      resolution: window.devicePixelRatio || 1,
+      autoDensity: true,
+      ${pixelArt ? `
+      roundPixels: true,
+      antialias: false,` : `
+      antialias: true,`}
+    });
+
+    // Add canvas to DOM
+    const container = document.getElementById('game-container');
+    if (container) {
+      container.appendChild(this.app.canvas);
     }
-    exportScenes(project, options, useTS) {
-        const ext = useTS ? 'ts' : 'js';
-        // Scene index
-        let sceneIndex = `import { Application, Container } from 'pixi.js';
-import { GameManager } from '../game/GameManager${useTS ? '' : '.js'}';
-
-${useTS
-            ? `
-export interface Scene {
-  name: string;
-  container: Container;
-  init: () => Promise<void>;
-  update: (delta: number) => void;
-  destroy: () => void;
-}
-`
-            : ''}
-
-const scenes${useTS ? ': Map<string, () => Promise<Scene>>' : ''} = new Map();
-
+
+    // Load assets
+    await this.loadAssets();
+
+    // Initialize game manager
+    this.gameManager = new GameManager(this.app);
+
+    // Load first scene
+    await loadScene('${project.scenes[0]?.name || "main"}', this.app, this.gameManager);
+
+    // Start game loop
+    this.app.ticker.add(this.update.bind(this));
+
+    console.log('${project.name} initialized!');
+  }
+
+  private async loadAssets()${useTS ? ": Promise<void>" : ""} {
+    // Register asset bundles
+    await Assets.init({ manifest: assetManifest });
+    
+    // Load all bundles
+    const bundles = assetManifest.bundles.map(b => b.name);
+    await Assets.loadBundle(bundles);
+  }
+
+  private update(ticker${useTS ? ": { deltaTime: number }" : ""})${useTS ? ": void" : ""} {
+    const delta = ticker.deltaTime;
+    this.gameManager.update(delta);
+  }
+}
+
+// Start game
+const game = new Game();
+game.init().catch(console.error);
 `;
-        for (const scene of project.scenes) {
-            const sceneName = this.sanitizeName(scene.name);
-            sceneIndex += `scenes.set('${scene.name}', () => import('./${sceneName}${useTS ? '' : '.js'}').then(m => m.default));\n`;
-        }
-        sceneIndex += `
-export async function loadScene(
-  name${useTS ? ': string' : ''}, 
-  app${useTS ? ': Application' : ''}, 
-  gameManager${useTS ? ': GameManager' : ''}
-)${useTS ? ': Promise<Scene | null>' : ''} {
-  const loader = scenes.get(name);
-  if (!loader) {
-    console.error(\`Scene "\${name}" not found\`);
-    return null;
-  }
-
-  const SceneClass = await loader();
-  const scene = new SceneClass(app, gameManager);
-  await scene.init();
-  
-  app.stage.addChild(scene.container);
-  gameManager.setCurrentScene(scene);
-  
-  return scene;
-}
-
-export { scenes };
+    this.addTextFile(`src/main.${ext}`, main);
+  }
+  exportScenes(project, options, useTS) {
+    const ext = useTS ? "ts" : "js";
+    let sceneIndex = `import { Application, Container } from 'pixi.js';
+import { GameManager } from '../game/GameManager${useTS ? "" : ".js"}';
+
+${useTS ? `
+export interface Scene {
+  name: string;
+  container: Container;
+  init: () => Promise<void>;
+  update: (delta: number) => void;
+  destroy: () => void;
+}
+` : ""}
+
+const scenes${useTS ? ": Map<string, () => Promise<Scene>>" : ""} = new Map();
+
+`;
+    for (const scene of project.scenes) {
+      const sceneName = this.sanitizeName(scene.name);
+      sceneIndex += `scenes.set('${scene.name}', () => import('./${sceneName}${useTS ? "" : ".js"}').then(m => m.default));
 `;
-        this.addTextFile(`src/scenes/index.${ext}`, sceneIndex);
-        // Individual scene files
-        for (const scene of project.scenes) {
-            this.exportScene(scene, project, useTS);
-        }
     }
-    exportScene(scene, project, useTS) {
-        const ext = useTS ? 'ts' : 'js';
-        const sceneName = this.sanitizeName(scene.name);
-        let content = `import { Application, Container, Sprite, Assets } from 'pixi.js';
-import { GameManager } from '../game/GameManager${useTS ? '' : '.js'}';
-${useTS ? `import type { Scene } from './index';` : ''}
-
-export default class ${sceneName}Scene ${useTS ? 'implements Scene' : ''} {
-  ${useTS ? 'public name: string;' : ''}
-  ${useTS ? 'public container: Container;' : ''}
-  ${useTS ? 'private app: Application;' : ''}
-  ${useTS ? 'private gameManager: GameManager;' : ''}
-  ${useTS ? 'private entities: Map<string, Container> = new Map();' : ''}
-
-  constructor(app${useTS ? ': Application' : ''}, gameManager${useTS ? ': GameManager' : ''}) {
-    this.name = '${scene.name}';
-    this.app = app;
-    this.gameManager = gameManager;
-    this.container = new Container();
-    ${useTS ? '' : 'this.entities = new Map();'}
-  }
-
-  async init()${useTS ? ': Promise<void>' : ''} {
+    sceneIndex += `
+export async function loadScene(
+  name${useTS ? ": string" : ""}, 
+  app${useTS ? ": Application" : ""}, 
+  gameManager${useTS ? ": GameManager" : ""}
+)${useTS ? ": Promise<Scene | null>" : ""} {
+  const loader = scenes.get(name);
+  if (!loader) {
+    console.error(\`Scene "\${name}" not found\`);
+    return null;
+  }
+
+  const SceneClass = await loader();
+  const scene = new SceneClass(app, gameManager);
+  await scene.init();
+  
+  app.stage.addChild(scene.container);
+  gameManager.setCurrentScene(scene);
+  
+  return scene;
+}
+
+export { scenes };
 `;
-        // Create entities
-        for (const entity of scene.entities) {
-            content += this.generateEntityCode(entity, project, useTS);
-        }
-        content += `  }
-
-  update(delta${useTS ? ': number' : ''})${useTS ? ': void' : ''} {
-    // Update logic for scene
-    for (const [id, entity] of this.entities) {
-      // Entity update logic
-    }
-  }
-
-  destroy()${useTS ? ': void' : ''} {
-    this.container.destroy({ children: true });
-    this.entities.clear();
-  }
-}
+    this.addTextFile(`src/scenes/index.${ext}`, sceneIndex);
+    for (const scene of project.scenes) {
+      this.exportScene(scene, project, useTS);
+    }
+  }
+  exportScene(scene, project, useTS) {
+    const ext = useTS ? "ts" : "js";
+    const sceneName = this.sanitizeName(scene.name);
+    let content = `import { Application, Container, Sprite, Assets } from 'pixi.js';
+import { GameManager } from '../game/GameManager${useTS ? "" : ".js"}';
+${useTS ? `import type { Scene } from './index';` : ""}
+
+export default class ${sceneName}Scene ${useTS ? "implements Scene" : ""} {
+  ${useTS ? "public name: string;" : ""}
+  ${useTS ? "public container: Container;" : ""}
+  ${useTS ? "private app: Application;" : ""}
+  ${useTS ? "private gameManager: GameManager;" : ""}
+  ${useTS ? "private entities: Map<string, Container> = new Map();" : ""}
+
+  constructor(app${useTS ? ": Application" : ""}, gameManager${useTS ? ": GameManager" : ""}) {
+    this.name = '${scene.name}';
+    this.app = app;
+    this.gameManager = gameManager;
+    this.container = new Container();
+    ${useTS ? "" : "this.entities = new Map();"}
+  }
+
+  async init()${useTS ? ": Promise<void>" : ""} {
 `;
-        this.addTextFile(`src/scenes/${sceneName}.${ext}`, content);
+    for (const entity of scene.entities) {
+      content += this.generateEntityCode(entity, project, useTS);
     }
-    generateEntityCode(entity, project, useTS) {
-        let code = `
-    // Entity: ${entity.name}
-    {
-      const entity = new Container();
-      entity.position.set(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0});
-      entity.rotation = ${entity.rotation ?? 0};
-      entity.scale.set(${entity.scale?.x ?? 1}, ${entity.scale?.y ?? 1});
+    content += `  }
+
+  update(delta${useTS ? ": number" : ""})${useTS ? ": void" : ""} {
+    // Update logic for scene
+    for (const [id, entity] of this.entities) {
+      // Entity update logic
+    }
+  }
+
+  destroy()${useTS ? ": void" : ""} {
+    this.container.destroy({ children: true });
+    this.entities.clear();
+  }
+}
 `;
-        for (const component of entity.components) {
-            switch (component.type) {
-                case 'sprite': {
-                    const spriteId = component.properties?.spriteId;
-                    const asset = project.assets.find((a) => a.id === spriteId);
-                    if (asset) {
-                        code += `
-      const sprite = Sprite.from('${asset.name}');
-      sprite.anchor.set(0.5);
-      entity.addChild(sprite);
+    this.addTextFile(`src/scenes/${sceneName}.${ext}`, content);
+  }
+  generateEntityCode(entity, project, useTS) {
+    let code = `
+    // Entity: ${entity.name}
+    {
+      const entity = new Container();
+      entity.position.set(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0});
+      entity.rotation = ${entity.rotation ?? 0};
+      entity.scale.set(${entity.scale?.x ?? 1}, ${entity.scale?.y ?? 1});
 `;
-                    }
-                    break;
-                }
-                case 'animated-sprite': {
-                    code += `
-      // Animated sprite would need AnimatedSprite setup
-      // const animSprite = new AnimatedSprite(textures);
+    for (const component of entity.components) {
+      switch (component.type) {
+        case "sprite": {
+          const spriteId = component.properties?.spriteId;
+          const asset = project.assets.find((a) => a.id === spriteId);
+          if (asset) {
+            code += `
+      const sprite = Sprite.from('${asset.name}');
+      sprite.anchor.set(0.5);
+      entity.addChild(sprite);
 `;
-                    break;
-                }
-            }
+          }
+          break;
         }
-        code += `
-      this.container.addChild(entity);
-      this.entities.set('${entity.id}', entity);
-    }
+        case "animated-sprite": {
+          code += `
+      // Animated sprite would need AnimatedSprite setup
+      // const animSprite = new AnimatedSprite(textures);
 `;
-        // Process children
-        if (entity.children) {
-            for (const child of entity.children) {
-                code += this.generateEntityCode(child, project, useTS);
-            }
+          break;
         }
-        return code;
+      }
     }
-    async exportScripts(project, options, _useTS) {
-        for (const script of project.scripts) {
-            try {
-                const ast = this.graphToAST.convert(script);
-                const result = this.tsExporter.export(ast, {
-                    includeDebugComments: options.debug,
-                });
-                for (const file of result.files) {
-                    this.addTextFile(`src/scripts/${file.path}`, file.content);
-                }
-            }
-            catch (error) {
-                this.addWarning('SCRIPT_EXPORT_ERROR', `Failed to export script "${script.name}": ${error}`);
-            }
-        }
+    code += `
+      this.container.addChild(entity);
+      this.entities.set('${entity.id}', entity);
     }
-    exportAssetManifest(project) {
-        const bundles = [];
-        // Group assets by type
-        const spriteAssets = project.assets.filter((a) => a.type === 'sprite');
-        const audioAssets = project.assets.filter((a) => a.type === 'audio');
-        const fontAssets = project.assets.filter((a) => a.type === 'font');
-        // Sprites bundle
-        if (spriteAssets.length > 0) {
-            bundles.push({
-                name: 'sprites',
-                assets: spriteAssets.map((a) => ({
-                    alias: a.name,
-                    src: `assets/sprites/${a.path}`,
-                })),
-            });
-        }
-        // Audio bundle
-        if (audioAssets.length > 0) {
-            bundles.push({
-                name: 'audio',
-                assets: audioAssets.map((a) => ({
-                    alias: a.name,
-                    src: `assets/audio/${a.path}`,
-                })),
-            });
-        }
-        // Fonts bundle
-        if (fontAssets.length > 0) {
-            bundles.push({
-                name: 'fonts',
-                assets: fontAssets.map((a) => ({
-                    alias: a.name,
-                    src: `assets/fonts/${a.path}`,
-                })),
-            });
-        }
-        const manifest = {
-            bundles,
-        };
-        this.addTextFile('src/assets/manifest.ts', `export const assetManifest = ${JSON.stringify(manifest, null, 2)};`);
+`;
+    if (entity.children) {
+      for (const child of entity.children) {
+        code += this.generateEntityCode(child, project, useTS);
+      }
     }
-    exportBundlerConfig(project, bundler, useTS) {
-        switch (bundler) {
-            case 'vite':
-                this.addTextFile('vite.config.ts', `import { defineConfig } from 'vite';
-
-export default defineConfig({
-  base: './',
-  build: {
-    outDir: 'dist',
-    assetsDir: 'assets',
-    sourcemap: true,
-  },
-  server: {
-    port: 3000,
-    open: true,
-  },
-});
-`);
-                break;
-            case 'webpack':
-                this.addTextFile('webpack.config.js', `const path = require('path');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-
-module.exports = {
-  entry: './src/main.${useTS ? 'ts' : 'js'}',
-  output: {
-    filename: 'bundle.js',
-    path: path.resolve(__dirname, 'dist'),
-  },
-  resolve: {
-    extensions: ['.ts', '.js'],
-  },
-  module: {
-    rules: [
-      {
-        test: /\\.ts$/,
-        use: 'ts-loader',
-        exclude: /node_modules/,
-      },
-    ],
-  },
-  plugins: [
-    new HtmlWebpackPlugin({
-      template: 'index.html',
-    }),
-  ],
-  devServer: {
-    static: './dist',
-    port: 3000,
-    open: true,
-  },
-};
-`);
-                break;
+    return code;
+  }
+  async exportScripts(project, options, _useTS) {
+    for (const script of project.scripts) {
+      try {
+        const ast = this.graphToAST.convert(script);
+        const result = this.tsExporter.export(ast, {
+          includeDebugComments: options.debug
+        });
+        for (const file of result.files) {
+          this.addTextFile(`src/scripts/${file.path}`, file.content);
         }
+      } catch (error) {
+        this.addWarning(
+          "SCRIPT_EXPORT_ERROR",
+          `Failed to export script "${script.name}": ${error}`
+        );
+      }
     }
-    exportPWAFiles(project) {
-        // manifest.json
-        const manifest = {
-            name: project.name,
-            short_name: project.name.slice(0, 12),
-            description: project.description || '',
-            start_url: '/',
-            display: 'fullscreen',
-            background_color: project.settings.backgroundColor,
-            theme_color: project.settings.backgroundColor,
-            icons: [
-                { src: 'icon-192.png', sizes: '192x192', type: 'image/png' },
-                { src: 'icon-512.png', sizes: '512x512', type: 'image/png' },
-            ],
-        };
-        this.addTextFile('public/manifest.json', JSON.stringify(manifest, null, 2));
-        // service-worker.js
-        this.addTextFile('public/sw.js', `const CACHE_NAME = '${project.name}-v${project.version}';
-const urlsToCache = [
-  '/',
-  '/index.html',
-  '/src/main.ts',
-];
-
-self.addEventListener('install', (event) => {
-  event.waitUntil(
-    caches.open(CACHE_NAME)
-      .then((cache) => cache.addAll(urlsToCache))
-  );
-});
-
-self.addEventListener('fetch', (event) => {
-  event.respondWith(
-    caches.match(event.request)
-      .then((response) => response || fetch(event.request))
-  );
-});
-`);
+  }
+  exportAssetManifest(project) {
+    const bundles = [];
+    const spriteAssets = project.assets.filter((a) => a.type === "sprite");
+    const audioAssets = project.assets.filter((a) => a.type === "audio");
+    const fontAssets = project.assets.filter((a) => a.type === "font");
+    if (spriteAssets.length > 0) {
+      bundles.push({
+        name: "sprites",
+        assets: spriteAssets.map((a) => ({
+          alias: a.name,
+          src: `assets/sprites/${a.path}`
+        }))
+      });
     }
-    exportUtilities(project, useTS) {
-        const ext = useTS ? 'ts' : 'js';
-        // GameManager
-        const gameManager = `import { Application, Container } from 'pixi.js';
-${useTS ? `import type { Scene } from '../scenes/index';` : ''}
-
-export class GameManager {
-  ${useTS ? 'private app: Application;' : ''}
-  ${useTS ? 'private currentScene: Scene | null = null;' : ''}
-  ${useTS ? 'private entities: Map<string, Container> = new Map();' : ''}
-  ${useTS ? 'private isPaused: boolean = false;' : ''}
-
-  constructor(app${useTS ? ': Application' : ''}) {
-    this.app = app;
-    ${useTS
-            ? ''
-            : `
-    this.currentScene = null;
-    this.entities = new Map();
-    this.isPaused = false;`}
-  }
-
-  setCurrentScene(scene${useTS ? ': Scene' : ''})${useTS ? ': void' : ''} {
-    if (this.currentScene) {
-      this.currentScene.destroy();
-      this.app.stage.removeChild(this.currentScene.container);
-    }
-    this.currentScene = scene;
-  }
-
-  registerEntity(id${useTS ? ': string' : ''}, entity${useTS ? ': Container' : ''})${useTS ? ': void' : ''} {
-    this.entities.set(id, entity);
-  }
-
-  getEntity(id${useTS ? ': string' : ''})${useTS ? ': Container | undefined' : ''} {
-    return this.entities.get(id);
-  }
-
-  update(delta${useTS ? ': number' : ''})${useTS ? ': void' : ''} {
-    if (this.isPaused) return;
-    
-    if (this.currentScene) {
-      this.currentScene.update(delta);
-    }
-  }
-
-  pause()${useTS ? ': void' : ''} {
-    this.isPaused = true;
-  }
-
-  resume()${useTS ? ': void' : ''} {
-    this.isPaused = false;
-  }
-
-  get paused()${useTS ? ': boolean' : ''} {
-    return this.isPaused;
-  }
-}
-`;
-        this.addTextFile(`src/game/GameManager.${ext}`, gameManager);
-        // Input manager
-        const inputManager = `export class InputManager {
-  ${useTS ? 'private keys: Set<string> = new Set();' : ''}
-  ${useTS ? 'private keysJustPressed: Set<string> = new Set();' : ''}
-  ${useTS ? 'private mousePosition: { x: number; y: number } = { x: 0, y: 0 };' : ''}
-  ${useTS ? 'private mouseButtons: Set<number> = new Set();' : ''}
-
-  constructor() {
-    ${useTS
-            ? ''
-            : `
-    this.keys = new Set();
-    this.keysJustPressed = new Set();
-    this.mousePosition = { x: 0, y: 0 };
-    this.mouseButtons = new Set();`}
-    
-    window.addEventListener('keydown', this.onKeyDown.bind(this));
-    window.addEventListener('keyup', this.onKeyUp.bind(this));
-    window.addEventListener('mousemove', this.onMouseMove.bind(this));
-    window.addEventListener('mousedown', this.onMouseDown.bind(this));
-    window.addEventListener('mouseup', this.onMouseUp.bind(this));
-  }
-
-  private onKeyDown(e${useTS ? ': KeyboardEvent' : ''})${useTS ? ': void' : ''} {
-    if (!this.keys.has(e.code)) {
-      this.keysJustPressed.add(e.code);
-    }
-    this.keys.add(e.code);
-  }
-
-  private onKeyUp(e${useTS ? ': KeyboardEvent' : ''})${useTS ? ': void' : ''} {
-    this.keys.delete(e.code);
-  }
-
-  private onMouseMove(e${useTS ? ': MouseEvent' : ''})${useTS ? ': void' : ''} {
-    this.mousePosition.x = e.clientX;
-    this.mousePosition.y = e.clientY;
-  }
-
-  private onMouseDown(e${useTS ? ': MouseEvent' : ''})${useTS ? ': void' : ''} {
-    this.mouseButtons.add(e.button);
-  }
-
-  private onMouseUp(e${useTS ? ': MouseEvent' : ''})${useTS ? ': void' : ''} {
-    this.mouseButtons.delete(e.button);
-  }
-
-  isKeyPressed(code${useTS ? ': string' : ''})${useTS ? ': boolean' : ''} {
-    return this.keys.has(code);
-  }
-
-  isKeyJustPressed(code${useTS ? ': string' : ''})${useTS ? ': boolean' : ''} {
-    const pressed = this.keysJustPressed.has(code);
-    this.keysJustPressed.delete(code);
-    return pressed;
-  }
-
-  isMouseButtonPressed(button${useTS ? ': number' : ''})${useTS ? ': boolean' : ''} {
-    return this.mouseButtons.has(button);
-  }
-
-  getMousePosition()${useTS ? ': { x: number; y: number }' : ''} {
-    return { ...this.mousePosition };
-  }
-
-  update()${useTS ? ': void' : ''} {
-    this.keysJustPressed.clear();
-  }
-}
-
-export const input = new InputManager();
-`;
-        this.addTextFile(`src/game/InputManager.${ext}`, inputManager);
+    if (audioAssets.length > 0) {
+      bundles.push({
+        name: "audio",
+        assets: audioAssets.map((a) => ({
+          alias: a.name,
+          src: `assets/audio/${a.path}`
+        }))
+      });
+    }
+    if (fontAssets.length > 0) {
+      bundles.push({
+        name: "fonts",
+        assets: fontAssets.map((a) => ({
+          alias: a.name,
+          src: `assets/fonts/${a.path}`
+        }))
+      });
+    }
+    const manifest = {
+      bundles
+    };
+    this.addTextFile(
+      "src/assets/manifest.ts",
+      `export const assetManifest = ${JSON.stringify(manifest, null, 2)};`
+    );
+  }
+  exportBundlerConfig(project, bundler, useTS) {
+    switch (bundler) {
+      case "vite":
+        this.addTextFile(
+          "vite.config.ts",
+          `import { defineConfig } from 'vite';
+
+export default defineConfig({
+  base: './',
+  build: {
+    outDir: 'dist',
+    assetsDir: 'assets',
+    sourcemap: true,
+  },
+  server: {
+    port: 3000,
+    open: true,
+  },
+});
+`
+        );
+        break;
+      case "webpack":
+        this.addTextFile(
+          "webpack.config.js",
+          `const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+module.exports = {
+  entry: './src/main.${useTS ? "ts" : "js"}',
+  output: {
+    filename: 'bundle.js',
+    path: path.resolve(__dirname, 'dist'),
+  },
+  resolve: {
+    extensions: ['.ts', '.js'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\\.ts$/,
+        use: 'ts-loader',
+        exclude: /node_modules/,
+      },
+    ],
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      template: 'index.html',
+    }),
+  ],
+  devServer: {
+    static: './dist',
+    port: 3000,
+    open: true,
+  },
+};
+`
+        );
+        break;
     }
-    exportTSConfig() {
-        const tsconfig = {
-            compilerOptions: {
-                target: 'ES2020',
-                useDefineForClassFields: true,
-                module: 'ESNext',
-                lib: ['ES2020', 'DOM', 'DOM.Iterable'],
-                skipLibCheck: true,
-                moduleResolution: 'bundler',
-                allowImportingTsExtensions: true,
-                resolveJsonModule: true,
-                isolatedModules: true,
-                noEmit: true,
-                strict: true,
-                noUnusedLocals: true,
-                noUnusedParameters: true,
-                noFallthroughCasesInSwitch: true,
-            },
-            include: ['src'],
-        };
-        this.addTextFile('tsconfig.json', JSON.stringify(tsconfig, null, 2));
+  }
+  exportPWAFiles(project) {
+    const manifest = {
+      name: project.name,
+      short_name: project.name.slice(0, 12),
+      description: project.description || "",
+      start_url: "/",
+      display: "fullscreen",
+      background_color: project.settings.backgroundColor,
+      theme_color: project.settings.backgroundColor,
+      icons: [
+        { src: "icon-192.png", sizes: "192x192", type: "image/png" },
+        { src: "icon-512.png", sizes: "512x512", type: "image/png" }
+      ]
+    };
+    this.addTextFile("public/manifest.json", JSON.stringify(manifest, null, 2));
+    this.addTextFile(
+      "public/sw.js",
+      `const CACHE_NAME = '${project.name}-v${project.version}';
+const urlsToCache = [
+  '/',
+  '/index.html',
+  '/src/main.ts',
+];
+
+self.addEventListener('install', (event) => {
+  event.waitUntil(
+    caches.open(CACHE_NAME)
+      .then((cache) => cache.addAll(urlsToCache))
+  );
+});
+
+self.addEventListener('fetch', (event) => {
+  event.respondWith(
+    caches.match(event.request)
+      .then((response) => response || fetch(event.request))
+  );
+});
+`
+    );
+  }
+  exportUtilities(project, useTS) {
+    const ext = useTS ? "ts" : "js";
+    const gameManager = `import { Application, Container } from 'pixi.js';
+${useTS ? `import type { Scene } from '../scenes/index';` : ""}
+
+export class GameManager {
+  ${useTS ? "private app: Application;" : ""}
+  ${useTS ? "private currentScene: Scene | null = null;" : ""}
+  ${useTS ? "private entities: Map<string, Container> = new Map();" : ""}
+  ${useTS ? "private isPaused: boolean = false;" : ""}
+
+  constructor(app${useTS ? ": Application" : ""}) {
+    this.app = app;
+    ${useTS ? "" : `
+    this.currentScene = null;
+    this.entities = new Map();
+    this.isPaused = false;`}
+  }
+
+  setCurrentScene(scene${useTS ? ": Scene" : ""})${useTS ? ": void" : ""} {
+    if (this.currentScene) {
+      this.currentScene.destroy();
+      this.app.stage.removeChild(this.currentScene.container);
     }
-    hexToNumber(hex) {
-        return parseInt(hex.replace('#', ''), 16);
+    this.currentScene = scene;
+  }
+
+  registerEntity(id${useTS ? ": string" : ""}, entity${useTS ? ": Container" : ""})${useTS ? ": void" : ""} {
+    this.entities.set(id, entity);
+  }
+
+  getEntity(id${useTS ? ": string" : ""})${useTS ? ": Container | undefined" : ""} {
+    return this.entities.get(id);
+  }
+
+  update(delta${useTS ? ": number" : ""})${useTS ? ": void" : ""} {
+    if (this.isPaused) return;
+    
+    if (this.currentScene) {
+      this.currentScene.update(delta);
     }
-    sanitizeName(name) {
-        return name.replace(/[^a-zA-Z0-9]/g, '');
+  }
+
+  pause()${useTS ? ": void" : ""} {
+    this.isPaused = true;
+  }
+
+  resume()${useTS ? ": void" : ""} {
+    this.isPaused = false;
+  }
+
+  get paused()${useTS ? ": boolean" : ""} {
+    return this.isPaused;
+  }
+}
+`;
+    this.addTextFile(`src/game/GameManager.${ext}`, gameManager);
+    const inputManager = `export class InputManager {
+  ${useTS ? "private keys: Set<string> = new Set();" : ""}
+  ${useTS ? "private keysJustPressed: Set<string> = new Set();" : ""}
+  ${useTS ? "private mousePosition: { x: number; y: number } = { x: 0, y: 0 };" : ""}
+  ${useTS ? "private mouseButtons: Set<number> = new Set();" : ""}
+
+  constructor() {
+    ${useTS ? "" : `
+    this.keys = new Set();
+    this.keysJustPressed = new Set();
+    this.mousePosition = { x: 0, y: 0 };
+    this.mouseButtons = new Set();`}
+    
+    window.addEventListener('keydown', this.onKeyDown.bind(this));
+    window.addEventListener('keyup', this.onKeyUp.bind(this));
+    window.addEventListener('mousemove', this.onMouseMove.bind(this));
+    window.addEventListener('mousedown', this.onMouseDown.bind(this));
+    window.addEventListener('mouseup', this.onMouseUp.bind(this));
+  }
+
+  private onKeyDown(e${useTS ? ": KeyboardEvent" : ""})${useTS ? ": void" : ""} {
+    if (!this.keys.has(e.code)) {
+      this.keysJustPressed.add(e.code);
     }
+    this.keys.add(e.code);
+  }
+
+  private onKeyUp(e${useTS ? ": KeyboardEvent" : ""})${useTS ? ": void" : ""} {
+    this.keys.delete(e.code);
+  }
+
+  private onMouseMove(e${useTS ? ": MouseEvent" : ""})${useTS ? ": void" : ""} {
+    this.mousePosition.x = e.clientX;
+    this.mousePosition.y = e.clientY;
+  }
+
+  private onMouseDown(e${useTS ? ": MouseEvent" : ""})${useTS ? ": void" : ""} {
+    this.mouseButtons.add(e.button);
+  }
+
+  private onMouseUp(e${useTS ? ": MouseEvent" : ""})${useTS ? ": void" : ""} {
+    this.mouseButtons.delete(e.button);
+  }
+
+  isKeyPressed(code${useTS ? ": string" : ""})${useTS ? ": boolean" : ""} {
+    return this.keys.has(code);
+  }
+
+  isKeyJustPressed(code${useTS ? ": string" : ""})${useTS ? ": boolean" : ""} {
+    const pressed = this.keysJustPressed.has(code);
+    this.keysJustPressed.delete(code);
+    return pressed;
+  }
+
+  isMouseButtonPressed(button${useTS ? ": number" : ""})${useTS ? ": boolean" : ""} {
+    return this.mouseButtons.has(button);
+  }
+
+  getMousePosition()${useTS ? ": { x: number; y: number }" : ""} {
+    return { ...this.mousePosition };
+  }
+
+  update()${useTS ? ": void" : ""} {
+    this.keysJustPressed.clear();
+  }
+}
+
+export const input = new InputManager();
+`;
+    this.addTextFile(`src/game/InputManager.${ext}`, inputManager);
+  }
+  exportTSConfig() {
+    const tsconfig = {
+      compilerOptions: {
+        target: "ES2020",
+        useDefineForClassFields: true,
+        module: "ESNext",
+        lib: ["ES2020", "DOM", "DOM.Iterable"],
+        skipLibCheck: true,
+        moduleResolution: "bundler",
+        allowImportingTsExtensions: true,
+        resolveJsonModule: true,
+        isolatedModules: true,
+        noEmit: true,
+        strict: true,
+        noUnusedLocals: true,
+        noUnusedParameters: true,
+        noFallthroughCasesInSwitch: true
+      },
+      include: ["src"]
+    };
+    this.addTextFile("tsconfig.json", JSON.stringify(tsconfig, null, 2));
+  }
+  hexToNumber(hex) {
+    return parseInt(hex.replace("#", ""), 16);
+  }
+  sanitizeName(name) {
+    return name.replace(/[^a-zA-Z0-9]/g, "");
+  }
 }
-/* ── Phaser Exporter ──────────────────────────────────────────── */
 class PhaserExporter extends PlatformExporter {
-    constructor() {
-        super(...arguments);
-        this.platformId = 'phaser';
-        this.platformInfo = {
-            id: 'phaser',
-            name: 'Phaser',
-            description: 'Desktop and mobile HTML5 game framework',
-            website: 'https://phaser.io',
-            features: ['2d-rendering', 'physics-2d', 'audio', 'tilemaps', 'particles', 'animation'],
-            supportedAssets: ['sprite', 'tileset', 'audio', 'font', 'script', 'animation', 'tilemap'],
-            exportFormats: ['.html', '.js', '.ts'],
-        };
-        this.tsExporter = new TypeScriptExporter();
-        this.graphToAST = new GraphToAST();
+  constructor() {
+    super(...arguments);
+    this.platformId = "phaser";
+    this.platformInfo = {
+      id: "phaser",
+      name: "Phaser",
+      description: "Desktop and mobile HTML5 game framework",
+      website: "https://phaser.io",
+      features: ["2d-rendering", "physics-2d", "audio", "tilemaps", "particles", "animation"],
+      supportedAssets: ["sprite", "tileset", "audio", "font", "script", "animation", "tilemap"],
+      exportFormats: [".html", ".js", ".ts"]
+    };
+    this.tsExporter = new TypeScriptExporter();
+    this.graphToAST = new GraphToAST();
+  }
+  async doExport(project, options) {
+    const web = options.platformOptions;
+    const useTS = web?.typescript !== false;
+    const bundler = web?.bundler || "vite";
+    this.exportPackageJson(project, web);
+    this.exportIndexHtml(project);
+    this.exportMainGame(project, options, useTS);
+    this.exportScenes(project, options, useTS);
+    await this.exportScripts(project, options, useTS);
+    if (bundler !== "none") {
+      this.exportBundlerConfig(bundler, useTS);
     }
-    async doExport(project, options) {
-        const web = options.platformOptions;
-        const useTS = web?.typescript !== false;
-        const bundler = web?.bundler || 'vite';
-        // 1. Generate package.json
-        this.exportPackageJson(project, web);
-        // 2. Generate HTML entry
-        this.exportIndexHtml(project);
-        // 3. Generate main game config
-        this.exportMainGame(project, options, useTS);
-        // 4. Export scenes
-        this.exportScenes(project, options, useTS);
-        // 5. Export scripts
-        await this.exportScripts(project, options, useTS);
-        // 6. Generate bundler config
-        if (bundler !== 'none') {
-            this.exportBundlerConfig(bundler, useTS);
-        }
-        // 7. Generate tsconfig if TypeScript
-        if (useTS) {
-            this.exportTSConfig();
-        }
+    if (useTS) {
+      this.exportTSConfig();
     }
-    exportPackageJson(project, web) {
-        const useTS = web?.typescript !== false;
-        const bundler = web?.bundler || 'vite';
-        const phaserVersion = web?.frameworkVersion || '^3.70.0';
-        const packageJson = {
-            name: project.name.toLowerCase().replace(/\s+/g, '-'),
-            version: project.version,
-            type: 'module',
-            scripts: {
-                dev: bundler === 'vite' ? 'vite' : 'webpack serve',
-                build: bundler === 'vite' ? 'vite build' : 'webpack',
-            },
-            dependencies: {
-                phaser: phaserVersion,
-            },
-            devDependencies: {
-                ...(useTS ? { typescript: '^5.0.0' } : {}),
-                ...(bundler === 'vite' ? { vite: '^5.0.0' } : {}),
-            },
-        };
-        this.addTextFile('package.json', JSON.stringify(packageJson, null, 2));
+  }
+  exportPackageJson(project, web) {
+    const useTS = web?.typescript !== false;
+    const bundler = web?.bundler || "vite";
+    const phaserVersion = web?.frameworkVersion || "^3.70.0";
+    const packageJson = {
+      name: project.name.toLowerCase().replace(/\s+/g, "-"),
+      version: project.version,
+      type: "module",
+      scripts: {
+        dev: bundler === "vite" ? "vite" : "webpack serve",
+        build: bundler === "vite" ? "vite build" : "webpack"
+      },
+      dependencies: {
+        phaser: phaserVersion
+      },
+      devDependencies: {
+        ...useTS ? { typescript: "^5.0.0" } : {},
+        ...bundler === "vite" ? { vite: "^5.0.0" } : {}
+      }
+    };
+    this.addTextFile("package.json", JSON.stringify(packageJson, null, 2));
+  }
+  exportIndexHtml(project) {
+    const html = `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>${project.name}</title>
+  <style>
+    * { margin: 0; padding: 0; }
+    body { 
+      background: ${project.settings.backgroundColor}; 
+      display: flex; 
+      justify-content: center; 
+      align-items: center; 
+      min-height: 100vh;
     }
-    exportIndexHtml(project) {
-        const html = `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${project.name}</title>
-  <style>
-    * { margin: 0; padding: 0; }
-    body { 
-      background: ${project.settings.backgroundColor}; 
-      display: flex; 
-      justify-content: center; 
-      align-items: center; 
-      min-height: 100vh;
-    }
-    canvas { 
-      ${project.settings.rendering?.pixelArt ? 'image-rendering: pixelated;' : ''} 
-    }
-  </style>
-</head>
-<body>
-  <script type="module" src="/src/main.ts"></script>
-</body>
-</html>`;
-        this.addTextFile('index.html', html);
+    canvas { 
+      ${project.settings.rendering?.pixelArt ? "image-rendering: pixelated;" : ""} 
     }
-    exportMainGame(project, options, useTS) {
-        const ext = useTS ? 'ts' : 'js';
-        const { width, height } = project.settings.resolution;
-        const pixelArt = project.settings.rendering?.pixelArt;
-        const hasPhysics = project.settings.physics?.enabled;
-        let sceneImports = '';
-        let sceneList = '';
-        for (const scene of project.scenes) {
-            const sceneName = this.sanitizeName(scene.name);
-            sceneImports += `import { ${sceneName}Scene } from './scenes/${sceneName}${useTS ? '' : '.js'}';\n`;
-            sceneList += `${sceneName}Scene, `;
-        }
-        const main = `import Phaser from 'phaser';
-${sceneImports}
-
-const config${useTS ? ': Phaser.Types.Core.GameConfig' : ''} = {
-  type: Phaser.AUTO,
-  width: ${width},
-  height: ${height},
-  backgroundColor: '${project.settings.backgroundColor}',
-  parent: 'game-container',
-  ${pixelArt
-            ? `
-  pixelArt: true,
-  roundPixels: true,`
-            : ''}
-  ${hasPhysics
-            ? `
-  physics: {
-    default: 'arcade',
-    arcade: {
-      gravity: { x: ${project.settings.physics?.gravity.x ?? 0}, y: ${project.settings.physics?.gravity.y ?? 300} },
-      debug: ${options.debug || false}
-    }
-  },`
-            : ''}
-  scene: [${sceneList}],
-  scale: {
-    mode: Phaser.Scale.FIT,
-    autoCenter: Phaser.Scale.CENTER_BOTH,
-  },
-};
-
-const game = new Phaser.Game(config);
+  </style>
+</head>
+<body>
+  <script type="module" src="/src/main.ts"><\/script>
+</body>
+</html>`;
+    this.addTextFile("index.html", html);
+  }
+  exportMainGame(project, options, useTS) {
+    const ext = useTS ? "ts" : "js";
+    const { width, height } = project.settings.resolution;
+    const pixelArt = project.settings.rendering?.pixelArt;
+    const hasPhysics = project.settings.physics?.enabled;
+    let sceneImports = "";
+    let sceneList = "";
+    for (const scene of project.scenes) {
+      const sceneName = this.sanitizeName(scene.name);
+      sceneImports += `import { ${sceneName}Scene } from './scenes/${sceneName}${useTS ? "" : ".js"}';
 `;
-        this.addTextFile(`src/main.${ext}`, main);
+      sceneList += `${sceneName}Scene, `;
     }
-    exportScenes(project, options, useTS) {
-        for (const scene of project.scenes) {
-            this.exportScene(scene, project, useTS);
-        }
+    const main = `import Phaser from 'phaser';
+${sceneImports}
+
+const config${useTS ? ": Phaser.Types.Core.GameConfig" : ""} = {
+  type: Phaser.AUTO,
+  width: ${width},
+  height: ${height},
+  backgroundColor: '${project.settings.backgroundColor}',
+  parent: 'game-container',
+  ${pixelArt ? `
+  pixelArt: true,
+  roundPixels: true,` : ""}
+  ${hasPhysics ? `
+  physics: {
+    default: 'arcade',
+    arcade: {
+      gravity: { x: ${project.settings.physics?.gravity.x ?? 0}, y: ${project.settings.physics?.gravity.y ?? 300} },
+      debug: ${options.debug || false}
     }
-    exportScene(scene, project, useTS) {
-        const ext = useTS ? 'ts' : 'js';
-        const sceneName = this.sanitizeName(scene.name);
-        let content = `import Phaser from 'phaser';
-
-export class ${sceneName}Scene extends Phaser.Scene {
-  constructor() {
-    super({ key: '${scene.name}' });
-  }
-
-  preload()${useTS ? ': void' : ''} {
+  },` : ""}
+  scene: [${sceneList}],
+  scale: {
+    mode: Phaser.Scale.FIT,
+    autoCenter: Phaser.Scale.CENTER_BOTH,
+  },
+};
+
+const game = new Phaser.Game(config);
 `;
-        // Preload assets used in this scene
-        const usedAssets = this.getUsedAssets(scene, project);
-        for (const asset of usedAssets) {
-            switch (asset.type) {
-                case 'sprite':
-                    content += `    this.load.image('${asset.name}', 'assets/sprites/${asset.path}');\n`;
-                    break;
-                case 'audio':
-                    content += `    this.load.audio('${asset.name}', 'assets/audio/${asset.path}');\n`;
-                    break;
-                case 'tileset':
-                    content += `    this.load.image('${asset.name}', 'assets/tilesets/${asset.path}');\n`;
-                    break;
-            }
-        }
-        content += `  }
-
-  create()${useTS ? ': void' : ''} {
+    this.addTextFile(`src/main.${ext}`, main);
+  }
+  exportScenes(project, options, useTS) {
+    for (const scene of project.scenes) {
+      this.exportScene(scene, project, useTS);
+    }
+  }
+  exportScene(scene, project, useTS) {
+    const ext = useTS ? "ts" : "js";
+    const sceneName = this.sanitizeName(scene.name);
+    let content = `import Phaser from 'phaser';
+
+export class ${sceneName}Scene extends Phaser.Scene {
+  constructor() {
+    super({ key: '${scene.name}' });
+  }
+
+  preload()${useTS ? ": void" : ""} {
 `;
-        // Create entities
-        for (const entity of scene.entities) {
-            content += this.generateEntityCode(entity, project, useTS);
-        }
-        // Create tilemaps
-        for (const tilemap of scene.tilemaps ?? []) {
-            content += this.generateTilemapCode(tilemap, project);
-        }
-        content += `  }
-
-  update(time${useTS ? ': number' : ''}, delta${useTS ? ': number' : ''})${useTS ? ': void' : ''} {
-    // Update logic
-  }
-}
+    const usedAssets = this.getUsedAssets(scene, project);
+    for (const asset of usedAssets) {
+      switch (asset.type) {
+        case "sprite":
+          content += `    this.load.image('${asset.name}', 'assets/sprites/${asset.path}');
+`;
+          break;
+        case "audio":
+          content += `    this.load.audio('${asset.name}', 'assets/audio/${asset.path}');
 `;
-        this.addTextFile(`src/scenes/${sceneName}.${ext}`, content);
+          break;
+        case "tileset":
+          content += `    this.load.image('${asset.name}', 'assets/tilesets/${asset.path}');
+`;
+          break;
+      }
     }
-    generateEntityCode(entity, project, useTS) {
-        let code = `
-    // Entity: ${entity.name}
+    content += `  }
+
+  create()${useTS ? ": void" : ""} {
+`;
+    for (const entity of scene.entities) {
+      content += this.generateEntityCode(entity, project, useTS);
+    }
+    for (const tilemap of scene.tilemaps ?? []) {
+      content += this.generateTilemapCode(tilemap, project);
+    }
+    content += `  }
+
+  update(time${useTS ? ": number" : ""}, delta${useTS ? ": number" : ""})${useTS ? ": void" : ""} {
+    // Update logic
+  }
+}
+`;
+    this.addTextFile(`src/scenes/${sceneName}.${ext}`, content);
+  }
+  generateEntityCode(entity, project, useTS) {
+    let code = `
+    // Entity: ${entity.name}
+`;
+    for (const component of entity.components) {
+      switch (component.type) {
+        case "sprite": {
+          const spriteId = component.properties?.spriteId;
+          const asset = project.assets.find((a) => a.id === spriteId);
+          if (asset) {
+            const hasPhysics = entity.components.some(
+              (c) => c.type === "rigidbody-2d" || c.type === "box-collider-2d" || c.type === "circle-collider-2d"
+            );
+            if (hasPhysics) {
+              code += `    const ${this.varName(entity.name)} = this.physics.add.sprite(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${asset.name}');
+`;
+            } else {
+              code += `    const ${this.varName(entity.name)} = this.add.sprite(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${asset.name}');
 `;
-        for (const component of entity.components) {
-            switch (component.type) {
-                case 'sprite': {
-                    const spriteId = component.properties?.spriteId;
-                    const asset = project.assets.find((a) => a.id === spriteId);
-                    if (asset) {
-                        const hasPhysics = entity.components.some((c) => c.type === 'rigidbody-2d' ||
-                            c.type === 'box-collider-2d' ||
-                            c.type === 'circle-collider-2d');
-                        if (hasPhysics) {
-                            code += `    const ${this.varName(entity.name)} = this.physics.add.sprite(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${asset.name}');\n`;
-                        }
-                        else {
-                            code += `    const ${this.varName(entity.name)} = this.add.sprite(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${asset.name}');\n`;
-                        }
-                        code += `    ${this.varName(entity.name)}.setScale(${entity.scale?.x ?? 1}, ${entity.scale?.y ?? 1});\n`;
-                        code += `    ${this.varName(entity.name)}.setRotation(${entity.rotation ?? 0});\n`;
-                    }
-                    break;
-                }
-                case 'ui-text': {
-                    code += `    const ${this.varName(entity.name)} = this.add.text(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${component.properties?.text || ''}', {
-      fontSize: '${component.properties?.fontSize || 32}px',
-      color: '${component.properties?.color || '#ffffff'}',
-    });\n`;
-                    break;
-                }
-                case 'particle-system': {
-                    code += `    const ${this.varName(entity.name)}Particles = this.add.particles(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0});\n`;
-                    break;
-                }
-                case 'audio-source': {
-                    const clipId = component.properties?.clipId;
-                    const clip = project.assets.find((a) => a.id === clipId);
-                    if (clip && component.properties?.playOnAwake) {
-                        code += `    this.sound.play('${clip.name}', { loop: ${component.properties?.loop || false}, volume: ${component.properties?.volume || 1} });\n`;
-                    }
-                    break;
-                }
             }
+            code += `    ${this.varName(entity.name)}.setScale(${entity.scale?.x ?? 1}, ${entity.scale?.y ?? 1});
+`;
+            code += `    ${this.varName(entity.name)}.setRotation(${entity.rotation ?? 0});
+`;
+          }
+          break;
         }
-        // Process children
-        if (entity.children) {
-            for (const child of entity.children) {
-                code += this.generateEntityCode(child, project, useTS);
-            }
+        case "ui-text": {
+          code += `    const ${this.varName(entity.name)} = this.add.text(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0}, '${component.properties?.text || ""}', {
+      fontSize: '${component.properties?.fontSize || 32}px',
+      color: '${component.properties?.color || "#ffffff"}',
+    });
+`;
+          break;
         }
-        return code;
-    }
-    generateTilemapCode(tilemap, project) {
-        const tilesetAsset = project.assets.find((a) => a.id === tilemap.tilesetId);
-        if (!tilesetAsset) {
-            return '';
+        case "particle-system": {
+          code += `    const ${this.varName(entity.name)}Particles = this.add.particles(${entity.position?.x ?? 0}, ${entity.position?.y ?? 0});
+`;
+          break;
         }
-        return `
-    // Tilemap: ${tilemap.name}
-    const ${this.varName(tilemap.name)}Map = this.make.tilemap({ 
-      width: ${tilemap.width}, 
-      height: ${tilemap.height}, 
-      tileWidth: ${tilemap.tileSize}, 
-      tileHeight: ${tilemap.tileSize} 
-    });
-    const ${this.varName(tilemap.name)}Tileset = ${this.varName(tilemap.name)}Map.addTilesetImage('${tilesetAsset.name}');
+        case "audio-source": {
+          const clipId = component.properties?.clipId;
+          const clip = project.assets.find((a) => a.id === clipId);
+          if (clip && component.properties?.playOnAwake) {
+            code += `    this.sound.play('${clip.name}', { loop: ${component.properties?.loop || false}, volume: ${component.properties?.volume || 1} });
 `;
-    }
-    getUsedAssets(scene, project) {
-        const assetIds = new Set();
-        const collectFromEntity = (entity) => {
-            for (const component of entity.components) {
-                if (component.properties?.spriteId) {
-                    assetIds.add(component.properties.spriteId);
-                }
-                if (component.properties?.clipId) {
-                    assetIds.add(component.properties.clipId);
-                }
-            }
-            if (entity.children) {
-                entity.children.forEach(collectFromEntity);
-            }
-        };
-        scene.entities.forEach(collectFromEntity);
-        (scene.tilemaps ?? []).forEach((tm) => assetIds.add(tm.tilesetId));
-        return project.assets.filter((a) => assetIds.has(a.id));
-    }
-    async exportScripts(project, options, _useTS) {
-        for (const script of project.scripts) {
-            try {
-                const ast = this.graphToAST.convert(script);
-                const result = this.tsExporter.export(ast, {
-                    includeDebugComments: options.debug,
-                });
-                for (const file of result.files) {
-                    this.addTextFile(`src/scripts/${file.path}`, file.content);
-                }
-            }
-            catch (error) {
-                this.addWarning('SCRIPT_EXPORT_ERROR', `Failed to export script "${script.name}": ${error}`);
-            }
+          }
+          break;
         }
+      }
     }
-    exportBundlerConfig(bundler, _useTS) {
-        if (bundler === 'vite') {
-            this.addTextFile('vite.config.ts', `import { defineConfig } from 'vite';
-
-export default defineConfig({
-  base: './',
-  build: {
-    outDir: 'dist',
-  },
-});
-`);
-        }
+    if (entity.children) {
+      for (const child of entity.children) {
+        code += this.generateEntityCode(child, project, useTS);
+      }
     }
-    exportTSConfig() {
-        const tsconfig = {
-            compilerOptions: {
-                target: 'ES2020',
-                module: 'ESNext',
-                moduleResolution: 'bundler',
-                strict: true,
-                noEmit: true,
-                skipLibCheck: true,
-                lib: ['ES2020', 'DOM'],
-            },
-            include: ['src'],
-        };
-        this.addTextFile('tsconfig.json', JSON.stringify(tsconfig, null, 2));
+    return code;
+  }
+  generateTilemapCode(tilemap, project) {
+    const tilesetAsset = project.assets.find((a) => a.id === tilemap.tilesetId);
+    if (!tilesetAsset) {
+      return "";
     }
-    sanitizeName(name) {
-        return name.replace(/[^a-zA-Z0-9]/g, '');
+    return `
+    // Tilemap: ${tilemap.name}
+    const ${this.varName(tilemap.name)}Map = this.make.tilemap({ 
+      width: ${tilemap.width}, 
+      height: ${tilemap.height}, 
+      tileWidth: ${tilemap.tileSize}, 
+      tileHeight: ${tilemap.tileSize} 
+    });
+    const ${this.varName(tilemap.name)}Tileset = ${this.varName(tilemap.name)}Map.addTilesetImage('${tilesetAsset.name}');
+`;
+  }
+  getUsedAssets(scene, project) {
+    const assetIds = /* @__PURE__ */ new Set();
+    const collectFromEntity = (entity) => {
+      for (const component of entity.components) {
+        if (component.properties?.spriteId) {
+          assetIds.add(component.properties.spriteId);
+        }
+        if (component.properties?.clipId) {
+          assetIds.add(component.properties.clipId);
+        }
+      }
+      if (entity.children) {
+        entity.children.forEach(collectFromEntity);
+      }
+    };
+    scene.entities.forEach(collectFromEntity);
+    (scene.tilemaps ?? []).forEach((tm) => assetIds.add(tm.tilesetId));
+    return project.assets.filter((a) => assetIds.has(a.id));
+  }
+  async exportScripts(project, options, _useTS) {
+    for (const script of project.scripts) {
+      try {
+        const ast = this.graphToAST.convert(script);
+        const result = this.tsExporter.export(ast, {
+          includeDebugComments: options.debug
+        });
+        for (const file of result.files) {
+          this.addTextFile(`src/scripts/${file.path}`, file.content);
+        }
+      } catch (error) {
+        this.addWarning(
+          "SCRIPT_EXPORT_ERROR",
+          `Failed to export script "${script.name}": ${error}`
+        );
+      }
     }
-    varName(name) {
-        const sanitized = this.sanitizeName(name);
-        return sanitized.charAt(0).toLowerCase() + sanitized.slice(1);
+  }
+  exportBundlerConfig(bundler, _useTS) {
+    if (bundler === "vite") {
+      this.addTextFile(
+        "vite.config.ts",
+        `import { defineConfig } from 'vite';
+
+export default defineConfig({
+  base: './',
+  build: {
+    outDir: 'dist',
+  },
+});
+`
+      );
     }
+  }
+  exportTSConfig() {
+    const tsconfig = {
+      compilerOptions: {
+        target: "ES2020",
+        module: "ESNext",
+        moduleResolution: "bundler",
+        strict: true,
+        noEmit: true,
+        skipLibCheck: true,
+        lib: ["ES2020", "DOM"]
+      },
+      include: ["src"]
+    };
+    this.addTextFile("tsconfig.json", JSON.stringify(tsconfig, null, 2));
+  }
+  sanitizeName(name) {
+    return name.replace(/[^a-zA-Z0-9]/g, "");
+  }
+  varName(name) {
+    const sanitized = this.sanitizeName(name);
+    return sanitized.charAt(0).toLowerCase() + sanitized.slice(1);
+  }
 }
-
-export { PhaserExporter, PixiJSExporter };
+export {
+  PhaserExporter,
+  PixiJSExporter
+};