hightjs 0.3.2 → 0.3.3

package/dist/builder.js

@@ -234,6 +234,25 @@ async function watchWithChunks(entryPoint, outdir, hotReloadManager = null) {
     // limpar diretorio
     fs.rmSync(outdir, { recursive: true, force: true });
     try {
+        // Plugin para notificar quando o build termina
+        const buildCompletePlugin = {
+            name: 'build-complete',
+            setup(build) {
+                let isFirstBuild = true;
+                build.onEnd((result) => {
+                    if (hotReloadManager) {
+                        if (isFirstBuild) {
+                            isFirstBuild = false;
+                            hotReloadManager.onBuildComplete(true);
+                        }
+                        else {
+                            // Notifica o hot reload manager que o build foi concluído
+                            hotReloadManager.onBuildComplete(result.errors.length === 0);
+                        }
+                    }
+                });
+            }
+        };
         const context = await esbuild.context({
             entryPoints: [entryPoint],
             bundle: true,
@@ -243,7 +262,7 @@ async function watchWithChunks(entryPoint, outdir, hotReloadManager = null) {
             outdir: outdir,
             loader: { '.js': 'jsx', '.ts': 'tsx' },
             external: nodeBuiltIns,
-            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin],
+            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin, buildCompletePlugin],
             format: 'esm',
             jsx: 'automatic',
             define: {
@@ -327,6 +346,25 @@ async function build(entryPoint, outfile, isProduction = false) {
  */
 async function watch(entryPoint, outfile, hotReloadManager = null) {
     try {
+        // Plugin para notificar quando o build termina
+        const buildCompletePlugin = {
+            name: 'build-complete',
+            setup(build) {
+                let isFirstBuild = true;
+                build.onEnd((result) => {
+                    if (hotReloadManager) {
+                        if (isFirstBuild) {
+                            isFirstBuild = false;
+                            hotReloadManager.onBuildComplete(true);
+                        }
+                        else {
+                            // Notifica o hot reload manager que o build foi concluído
+                            hotReloadManager.onBuildComplete(result.errors.length === 0);
+                        }
+                    }
+                });
+            }
+        };
         const context = await esbuild.context({
             entryPoints: [entryPoint],
             bundle: true,
@@ -336,7 +374,7 @@ async function watch(entryPoint, outfile, hotReloadManager = null) {
             outfile: outfile,
             loader: { '.js': 'jsx', '.ts': 'tsx' },
             external: nodeBuiltIns,
-            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin],
+            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin, buildCompletePlugin],
             format: 'iife',
             globalName: 'HwebApp',
             jsx: 'automatic',

package/dist/hotReload.d.ts

@@ -9,6 +9,8 @@ export declare class HotReloadManager {
     private isShuttingDown;
     private debounceTimers;
     private customHotReloadListener;
+    private isBuilding;
+    private buildCompleteResolve;
     constructor(projectDir: string);
     start(): Promise<void>;
     handleUpgrade(request: IncomingMessage, socket: any, head: Buffer): void;
@@ -26,5 +28,5 @@ export declare class HotReloadManager {
     onFrontendChange(callback: () => void): void;
     setHotReloadListener(listener: (file: string) => Promise<void> | void): void;
     removeHotReloadListener(): void;
-    private checkFrontendBuild;
+    onBuildComplete(success: boolean): void;
 }

package/dist/hotReload.js

@@ -65,6 +65,8 @@ class HotReloadManager {
         this.isShuttingDown = false;
         this.debounceTimers = new Map();
         this.customHotReloadListener = null;
+        this.isBuilding = false;
+        this.buildCompleteResolve = null;
         this.projectDir = projectDir;
     }
     async start() {
@@ -198,20 +200,34 @@ class HotReloadManager {
         // Limpa o cache do arquivo alterado
         (0, router_1.clearFileCache)(filePath);
         this.clearBackendCache(filePath);
-        // Checa build se for .ts/.tsx/.js/.jsx
-        const ext = path.extname(filePath);
-        if ([".ts", ".tsx", ".js", ".jsx"].includes(ext)) {
-            const result = await this.checkFrontendBuild(filePath);
-            if (result.error) {
-                this.notifyClients('src-error', { file: filePath, error: result.error });
-                return;
-            }
-        }
-        // Se for arquivo de frontend, notifica o cliente para recarregar a página
+        // Se for arquivo de frontend, aguarda o build terminar antes de recarregar
         if (isFrontendFile) {
-            console_1.default.logWithout(console_1.Levels.INFO, console_1.Colors.BgRed, `📄 Recarregando frontend...`);
-            this.frontendChangeCallback?.();
-            this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            console_1.default.logWithout(console_1.Levels.INFO, console_1.Colors.BgRed, `📄 Aguardando build do frontend...`);
+            // Marca que estamos esperando um build
+            this.isBuilding = true;
+            // Cria uma promise que será resolvida quando o build terminar
+            const buildPromise = new Promise((resolve) => {
+                this.buildCompleteResolve = resolve;
+            });
+            // Aguarda o build terminar (com timeout de 30 segundos)
+            const timeoutPromise = new Promise((_, reject) => {
+                setTimeout(() => reject(new Error('Build timeout')), 30000);
+            });
+            try {
+                await Promise.race([buildPromise, timeoutPromise]);
+                console_1.default.logWithout(console_1.Levels.INFO, console_1.Colors.BgRed, `✅ Build concluído, recarregando frontend...`);
+                this.frontendChangeCallback?.();
+                this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            }
+            catch (error) {
+                console_1.default.logWithout(console_1.Levels.ERROR, console_1.Colors.BgRed, `⚠️ Timeout no build, recarregando mesmo assim...`);
+                this.frontendChangeCallback?.();
+                this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            }
+            finally {
+                this.isBuilding = false;
+                this.buildCompleteResolve = null;
+            }
         }
         // Se for arquivo de backend, recarrega o módulo e notifica
         if (isBackendFile) {
@@ -432,36 +448,12 @@ class HotReloadManager {
     removeHotReloadListener() {
         this.customHotReloadListener = null;
     }
-    async checkFrontendBuild(filePath) {
-        try {
-            const tsNodePath = require.resolve('ts-node');
-            const { spawn } = require('child_process');
-            return new Promise((resolve) => {
-                const proc = spawn(process.execPath, [tsNodePath, '--transpile-only', filePath], {
-                    cwd: this.projectDir,
-                    env: process.env,
-                    timeout: 10000 // Timeout de 10 segundos
-                });
-                let errorMsg = '';
-                proc.stderr.on('data', (data) => {
-                    errorMsg += data.toString();
-                });
-                proc.on('close', (code) => {
-                    if (code !== 0 && errorMsg) {
-                        resolve({ error: errorMsg });
-                    }
-                    else {
-                        resolve({});
-                    }
-                });
-                proc.on('error', (error) => {
-                    resolve({ error: error.message });
-                });
-            });
-        }
-        catch (error) {
-            return { error: `Erro ao verificar build: ${error}` };
+    onBuildComplete(success) {
+        if (this.buildCompleteResolve) {
+            this.buildCompleteResolve();
+            this.buildCompleteResolve = null;
         }
+        this.isBuilding = false;
     }
 }
 exports.HotReloadManager = HotReloadManager;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hightjs",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "HightJS is a high-level framework for building web applications with ease and speed. It provides a robust set of tools and features to streamline development and enhance productivity.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/builder.js

@@ -251,6 +251,25 @@ async function watchWithChunks(entryPoint, outdir, hotReloadManager = null) {
     // limpar diretorio
     fs.rmSync(outdir, { recursive: true, force: true });
     try {
+        // Plugin para notificar quando o build termina
+        const buildCompletePlugin = {
+            name: 'build-complete',
+            setup(build) {
+                let isFirstBuild = true;
+                build.onEnd((result) => {
+                    if (hotReloadManager) {
+                        if (isFirstBuild) {
+                            isFirstBuild = false;
+                            hotReloadManager.onBuildComplete(true);
+                        } else {
+                            // Notifica o hot reload manager que o build foi concluído
+                            hotReloadManager.onBuildComplete(result.errors.length === 0);
+                        }
+                    }
+                });
+            }
+        };
+
         const context = await esbuild.context({
             entryPoints: [entryPoint],
             bundle: true,
@@ -260,7 +279,7 @@ async function watchWithChunks(entryPoint, outdir, hotReloadManager = null) {
             outdir: outdir,
             loader: { '.js': 'jsx', '.ts': 'tsx' },
             external: nodeBuiltIns,
-            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin],
+            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin, buildCompletePlugin],
             format: 'esm',
             jsx: 'automatic',
             define: {
@@ -347,6 +366,25 @@ async function build(entryPoint, outfile, isProduction = false) {
  */
 async function watch(entryPoint, outfile, hotReloadManager = null) {
     try {
+        // Plugin para notificar quando o build termina
+        const buildCompletePlugin = {
+            name: 'build-complete',
+            setup(build) {
+                let isFirstBuild = true;
+                build.onEnd((result) => {
+                    if (hotReloadManager) {
+                        if (isFirstBuild) {
+                            isFirstBuild = false;
+                            hotReloadManager.onBuildComplete(true);
+                        } else {
+                            // Notifica o hot reload manager que o build foi concluído
+                            hotReloadManager.onBuildComplete(result.errors.length === 0);
+                        }
+                    }
+                });
+            }
+        };
+
         const context = await esbuild.context({
             entryPoints: [entryPoint],
             bundle: true,
@@ -356,7 +394,7 @@ async function watch(entryPoint, outfile, hotReloadManager = null) {
             outfile: outfile,
             loader: { '.js': 'jsx', '.ts': 'tsx' },
             external: nodeBuiltIns,
-            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin],
+            plugins: [postcssPlugin, npmDependenciesPlugin, reactResolvePlugin, buildCompletePlugin],
             format: 'iife',
             globalName: 'HwebApp',
             jsx: 'automatic',

package/src/hotReload.ts

@@ -39,6 +39,8 @@ export class HotReloadManager {
     private isShuttingDown: boolean = false;
     private debounceTimers: Map<string, NodeJS.Timeout> = new Map();
     private customHotReloadListener: ((file: string) => Promise<void> | void) | null = null;
+    private isBuilding: boolean = false;
+    private buildCompleteResolve: (() => void) | null = null;
 
     constructor(projectDir: string) {
         this.projectDir = projectDir;
@@ -200,21 +202,36 @@ export class HotReloadManager {
         clearFileCache(filePath);
         this.clearBackendCache(filePath);
 
-        // Checa build se for .ts/.tsx/.js/.jsx
-        const ext = path.extname(filePath);
-        if ([".ts", ".tsx", ".js", ".jsx"].includes(ext)) {
-            const result = await this.checkFrontendBuild(filePath);
-            if (result.error) {
-                this.notifyClients('src-error', { file: filePath, error: result.error });
-                return;
-            }
-        }
-
-        // Se for arquivo de frontend, notifica o cliente para recarregar a página
+        // Se for arquivo de frontend, aguarda o build terminar antes de recarregar
         if (isFrontendFile) {
-            Console.logWithout(Levels.INFO, Colors.BgRed,`📄 Recarregando frontend...`);
-            this.frontendChangeCallback?.();
-            this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            Console.logWithout(Levels.INFO, Colors.BgRed,`📄 Aguardando build do frontend...`);
+
+            // Marca que estamos esperando um build
+            this.isBuilding = true;
+
+            // Cria uma promise que será resolvida quando o build terminar
+            const buildPromise = new Promise<void>((resolve) => {
+                this.buildCompleteResolve = resolve;
+            });
+
+            // Aguarda o build terminar (com timeout de 30 segundos)
+            const timeoutPromise = new Promise<void>((_, reject) => {
+                setTimeout(() => reject(new Error('Build timeout')), 30000);
+            });
+
+            try {
+                await Promise.race([buildPromise, timeoutPromise]);
+                Console.logWithout(Levels.INFO, Colors.BgRed,`✅ Build concluído, recarregando frontend...`);
+                this.frontendChangeCallback?.();
+                this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            } catch (error) {
+                Console.logWithout(Levels.ERROR, Colors.BgRed,`⚠️ Timeout no build, recarregando mesmo assim...`);
+                this.frontendChangeCallback?.();
+                this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
+            } finally {
+                this.isBuilding = false;
+                this.buildCompleteResolve = null;
+            }
         }
 
         // Se for arquivo de backend, recarrega o módulo e notifica
@@ -453,38 +470,11 @@ export class HotReloadManager {
         this.customHotReloadListener = null;
     }
 
-    private async checkFrontendBuild(filePath: string) {
-        try {
-            const tsNodePath = require.resolve('ts-node');
-            const { spawn } = require('child_process');
-
-            return new Promise<{ error?: string }>((resolve) => {
-                const proc = spawn(process.execPath, [tsNodePath, '--transpile-only', filePath], {
-                    cwd: this.projectDir,
-                    env: process.env,
-                    timeout: 10000 // Timeout de 10 segundos
-                });
-
-                let errorMsg = '';
-
-                proc.stderr.on('data', (data: Buffer) => {
-                    errorMsg += data.toString();
-                });
-
-                proc.on('close', (code: number) => {
-                    if (code !== 0 && errorMsg) {
-                        resolve({ error: errorMsg });
-                    } else {
-                        resolve({});
-                    }
-                });
-
-                proc.on('error', (error: Error) => {
-                    resolve({ error: error.message });
-                });
-            });
-        } catch (error) {
-            return { error: `Erro ao verificar build: ${error}` };
+    onBuildComplete(success: boolean) {
+        if (this.buildCompleteResolve) {
+            this.buildCompleteResolve();
+            this.buildCompleteResolve = null;
         }
+        this.isBuilding = false;
     }
 }