vatts 1.2.0-alpha.1 → 1.2.0-alpha.2

package/dist/hotReload.js

@@ -1,3 +1,42 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HotReloadManager = void 0;
 /*
  * This file is part of the Vatts.js Project.
  * Copyright (c) 2026 itsmuzin
@@ -14,16 +53,17 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { WebSocket, WebSocketServer } from 'ws';
-import * as chokidar from 'chokidar';
-import * as path from 'path';
-import ts from 'typescript';
-import { clearFileCache } from './router';
-import Console, { Colors, Levels } from "./api/console";
+const ws_1 = require("ws");
+const chokidar = __importStar(require("chokidar"));
+const path = __importStar(require("path"));
+const fs = __importStar(require("fs"));
+const typescript_1 = __importDefault(require("typescript"));
+const router_1 = require("./router");
+const console_1 = __importStar(require("./api/console"));
 // Chaves para persistência global para sobreviver a reloads do backend
 const GLOBAL_ERROR_KEY = '__VATTS_LAST_BUILD_ERROR__';
 const GLOBAL_ACTIVE_MANAGER_KEY = '__VATTS_ACTIVE_HOT_RELOAD_MANAGER__';
-export class HotReloadManager {
+class HotReloadManager {
     wss = null;
     watchers = [];
     projectDir;
@@ -67,7 +107,7 @@ export class HotReloadManager {
             return;
         }
         if (!this.wss) {
-            this.wss = new WebSocketServer({
+            this.wss = new ws_1.WebSocketServer({
                 noServer: true,
                 perMessageDeflate: false,
                 maxPayload: 1024 * 1024
@@ -88,7 +128,7 @@ export class HotReloadManager {
             }
             const pingTimer = setInterval(() => {
                 const client = this.clients.get(ws);
-                if (client && ws.readyState === WebSocket.OPEN) {
+                if (client && ws.readyState === ws_1.WebSocket.OPEN) {
                     if (Date.now() - client.lastPong > 60000) {
                         ws.terminate();
                         return;
@@ -104,7 +144,7 @@ export class HotReloadManager {
             this.clients.set(ws, clientConnection);
             // Ao conectar, envia o status atual combinado
             setTimeout(() => {
-                if (ws.readyState !== WebSocket.OPEN)
+                if (ws.readyState !== ws_1.WebSocket.OPEN)
                     return;
                 this.broadcastCurrentState(ws);
             }, 0);
@@ -129,7 +169,7 @@ export class HotReloadManager {
                 this.cleanupClient(ws);
             });
             ws.on('error', (error) => {
-                Console.logWithout(Levels.ERROR, Colors.BgRed, `WebSocket error: ${error.message}`);
+                console_1.default.logWithout(console_1.Levels.ERROR, console_1.Colors.BgRed, `WebSocket error: ${error.message}`);
                 this.cleanupClient(ws);
             });
         });
@@ -182,8 +222,8 @@ export class HotReloadManager {
         watcher.on('change', debouncedChange);
         watcher.on('add', debouncedChange);
         watcher.on('unlink', (filePath) => {
-            Console.info(`File removed: ${path.basename(filePath)}`);
-            clearFileCache(filePath);
+            console_1.default.info(`File removed: ${path.basename(filePath)}`);
+            (0, router_1.clearFileCache)(filePath);
             this.clearBackendCache(filePath);
             // Unlink também precisa de try-catch se for chamar callbacks
             try {
@@ -233,7 +273,7 @@ export class HotReloadManager {
                 errorData.message.includes('TS2304') ||
                 errorData.message.includes('TS1005') ||
                 errorData.message.includes('TS17002'));
-        Console.error("Captured Backend Error:", errorData.message);
+        console_1.default.error("Captured Backend Error:", errorData.message);
         this.buildState = {
             ...currentState,
             backend: errorData,
@@ -243,20 +283,22 @@ export class HotReloadManager {
         this.notifyStatusChange();
     }
     async handleAnySrcChange(filePath) {
-        const dm = Console.dynamicLine(`File change detected ${path.basename(filePath)}, processing...`);
+        const dm = console_1.default.dynamicLine(`File change detected ${path.basename(filePath)}, processing...`);
         let hasBackendError = false;
         const isFrontendFile = filePath.includes(path.join('src', 'web', 'routes')) ||
             filePath.includes(path.join('src', 'web', 'components')) ||
             filePath.includes('layout.tsx') ||
             filePath.includes('not-found.tsx') ||
-            filePath.endsWith('.tsx');
+            filePath.endsWith('.tsx') ||
+            filePath.endsWith(".ts") ||
+            filePath.endsWith(".vue");
         const isBackendFile = filePath.includes(path.join('src', 'backend')) && !isFrontendFile;
-        clearFileCache(filePath);
+        (0, router_1.clearFileCache)(filePath);
         this.clearBackendCache(filePath);
         // Tenta executar os callbacks e captura erros do Backend (Router/SSR)
         try {
             if (isFrontendFile) {
-                Console.logWithout(Levels.INFO, undefined, `Frontend change detected: ${path.basename(filePath)}`);
+                console_1.default.logWithout(console_1.Levels.INFO, undefined, `Frontend change detected: ${path.basename(filePath)}`);
                 // CRÍTICO: Executa e captura erro
                 try {
                     this.frontendChangeCallback?.();
@@ -275,7 +317,7 @@ export class HotReloadManager {
                 this.notifyClients('frontend-reload', { file: filePath, event: 'change' });
             }
             else if (isBackendFile) {
-                Console.logWithout(Levels.INFO, undefined, `Backend change detected: ${path.basename(filePath)}. Reloading backend...`);
+                console_1.default.logWithout(console_1.Levels.INFO, undefined, `Backend change detected: ${path.basename(filePath)}. Reloading backend...`);
                 try {
                     this.backendApiChangeCallback?.();
                     // Se passou aqui, limpa erro de backend anterior
@@ -323,7 +365,7 @@ export class HotReloadManager {
             }
             catch (error) {
                 // @ts-ignore
-                Console.logWithout(Levels.ERROR, `Error in custom listener: ${error.message}`);
+                console_1.default.logWithout(console_1.Levels.ERROR, `Error in custom listener: ${error.message}`);
             }
         }
     }
@@ -351,7 +393,7 @@ export class HotReloadManager {
         const message = JSON.stringify({ type, data, timestamp: Date.now() });
         const deadClients = [];
         this.clients.forEach((client, ws) => {
-            if (ws.readyState === WebSocket.OPEN) {
+            if (ws.readyState === ws_1.WebSocket.OPEN) {
                 try {
                     ws.send(message);
                 }
@@ -589,7 +631,7 @@ export class HotReloadManager {
     onFrontendChange(callback) { this.frontendChangeCallback = callback; }
     setHotReloadListener(listener) {
         this.customHotReloadListener = listener;
-        Console.info('Hot reload custom listener registered');
+        console_1.default.info('Hot reload custom listener registered');
     }
     removeHotReloadListener() { this.customHotReloadListener = null; }
     // DEBUG: stack traces (rate-limited) para descobrir quem dispara onBuildComplete
@@ -622,7 +664,7 @@ export class HotReloadManager {
         const currentState = this.buildState;
         const buildId = typeof error?.buildId === 'number' ? error.buildId : undefined;
         if (success) {
-            // Não confia no bundler. Antes de ficar "verde", roda typecheck real.
+            // Não confia no bundler. Antes de ficar "verde", roda typecheck real (React + Vue).
             const tc = this.typecheckFrontend();
             if (!tc.ok) {
                 // Se já existe um erro de bundler (esbuild/rollup) mais específico, preserva ele.
@@ -664,7 +706,7 @@ export class HotReloadManager {
         this.watchers = [];
         this.clients.forEach((client, ws) => {
             clearInterval(client.pingTimer);
-            if (ws.readyState === WebSocket.OPEN)
+            if (ws.readyState === ws_1.WebSocket.OPEN)
                 ws.close();
         });
         this.clients.clear();
@@ -675,40 +717,145 @@ export class HotReloadManager {
     }
     lastTypecheckAt = 0;
     lastTypecheckResult = null;
+    /**
+     * Verifica erros específicos de arquivos Vue usando @vue/compiler-sfc.
+     * Isso permite capturar erros de sintaxe (como falta de ponto e vírgula, tags mal fechadas)
+     * que o compilador padrão pode emitir mas que precisam ser formatados para o cliente.
+     */
+    checkVueFiles() {
+        try {
+            // 1. Tenta carregar o compilador do Vue dinamicamente
+            let compiler;
+            try {
+                compiler = require('vue/compiler-sfc');
+            }
+            catch {
+                try {
+                    compiler = require('@vue/compiler-sfc');
+                }
+                catch {
+                    // Não é um projeto Vue ou dependência faltando, apenas ignora
+                    return null;
+                }
+            }
+            // 2. Scan síncrono para encontrar arquivos .vue em src/web
+            // Em projetos gigantes isso deve ser otimizado, mas para dev server é ok.
+            const findVueFiles = (dir) => {
+                let results = [];
+                if (!fs.existsSync(dir))
+                    return results;
+                const list = fs.readdirSync(dir);
+                list.forEach(file => {
+                    const filePath = path.join(dir, file);
+                    const stat = fs.statSync(filePath);
+                    if (stat && stat.isDirectory()) {
+                        if (file !== 'node_modules' && file !== '.git' && file !== 'dist') {
+                            results = results.concat(findVueFiles(filePath));
+                        }
+                    }
+                    else if (file.endsWith('.vue')) {
+                        results.push(filePath);
+                    }
+                });
+                return results;
+            };
+            const webSrc = path.join(this.projectDir, 'src');
+            const vueFiles = findVueFiles(webSrc);
+            if (vueFiles.length === 0)
+                return { ok: true };
+            // 3. Analisa cada arquivo Vue
+            for (const file of vueFiles) {
+                try {
+                    const content = fs.readFileSync(file, 'utf-8');
+                    const parsed = compiler.parse(content, {
+                        filename: file,
+                        sourceMap: false
+                    });
+                    // Verifica erros de compilação do template/script
+                    if (parsed.errors && parsed.errors.length > 0) {
+                        const firstError = parsed.errors[0];
+                        const loc = firstError.loc ? {
+                            file: file,
+                            line: firstError.loc.start.line,
+                            column: firstError.loc.start.column
+                        } : undefined;
+                        // Stack simulada para o overlay exibir bonito
+                        const syntheticStack = `SyntaxError: ${firstError.message}\n    at ${file}:${loc?.line}:${loc?.column}`;
+                        return {
+                            ok: false,
+                            error: {
+                                message: `Vue Error: ${firstError.message}`,
+                                type: 'VueCompilerError',
+                                loc,
+                                stack: syntheticStack,
+                                ts: Date.now()
+                            }
+                        };
+                    }
+                }
+                catch (readError) {
+                    // Ignora erro de leitura de arquivo individual
+                }
+            }
+        }
+        catch (e) {
+            // Ignora falha geral no checker do Vue
+        }
+        return { ok: true };
+    }
     typecheckFrontend() {
         try {
             const now = Date.now();
             if (this.lastTypecheckResult && now - this.lastTypecheckAt < 750)
                 return this.lastTypecheckResult;
+            // --- 1. Vue Check (New) ---
+            // Verifica arquivos Vue primeiro, pois o TS compiler padrão pode ignorá-los
+            // ou dar erros confusos se não estiver configurado com plugins.
+            const vueResult = this.checkVueFiles();
+            if (vueResult && !vueResult.ok) {
+                this.lastTypecheckAt = now;
+                this.lastTypecheckResult = vueResult;
+                return vueResult;
+            }
+            // --- 2. TypeScript Check (Existing) ---
             const projectDir = this.projectDir;
-            const configPath = ts.findConfigFile(projectDir, ts.sys.fileExists, 'tsconfig.json');
+            const configPath = typescript_1.default.findConfigFile(projectDir, typescript_1.default.sys.fileExists, 'tsconfig.json');
             if (!configPath) {
                 this.lastTypecheckAt = now;
                 this.lastTypecheckResult = { ok: true };
                 return this.lastTypecheckResult;
             }
-            const configFile = ts.readConfigFile(configPath, ts.sys.readFile);
+            const configFile = typescript_1.default.readConfigFile(configPath, typescript_1.default.sys.readFile);
             if (configFile.error) {
-                const msg = ts.flattenDiagnosticMessageText(configFile.error.messageText, '\n');
+                const msg = typescript_1.default.flattenDiagnosticMessageText(configFile.error.messageText, '\n');
                 const err = { message: `tsconfig read error: ${msg}`, type: 'TypeScriptConfigError', ts: Date.now() };
                 this.lastTypecheckAt = now;
                 this.lastTypecheckResult = { ok: false, error: err };
                 return this.lastTypecheckResult;
             }
-            const parsed = ts.parseJsonConfigFileContent(configFile.config, ts.sys, path.dirname(configPath));
+            const parsed = typescript_1.default.parseJsonConfigFileContent(configFile.config, typescript_1.default.sys, path.dirname(configPath));
             const options = { ...parsed.options, noEmit: true };
             const rootNames = parsed.fileNames;
             const webRoot = path.resolve(projectDir, 'src', 'web') + path.sep;
+            // Filtra apenas arquivos dentro de src/web para não checar backend aqui
             const filteredRoots = rootNames.filter(f => f.startsWith(webRoot));
-            const program = ts.createProgram(filteredRoots.length ? filteredRoots : rootNames, options);
-            const diagnostics = ts.getPreEmitDiagnostics(program);
+            // Se for um projeto Vue puro sem .ts/.tsx explícito na config, o createProgram pode ficar vazio,
+            // então usamos os rootNames originais se o filtro zerar tudo.
+            const filesToCheck = filteredRoots.length ? filteredRoots : rootNames;
+            if (filesToCheck.length === 0) {
+                this.lastTypecheckAt = now;
+                this.lastTypecheckResult = { ok: true };
+                return this.lastTypecheckResult;
+            }
+            const program = typescript_1.default.createProgram(filesToCheck, options);
+            const diagnostics = typescript_1.default.getPreEmitDiagnostics(program);
             if (!diagnostics.length) {
                 this.lastTypecheckAt = now;
                 this.lastTypecheckResult = { ok: true };
                 return this.lastTypecheckResult;
             }
             const first = diagnostics[0];
-            const message = ts.flattenDiagnosticMessageText(first.messageText, '\n');
+            const message = typescript_1.default.flattenDiagnosticMessageText(first.messageText, '\n');
             const code = typeof first.code === 'number' ? `TS${first.code}` : undefined;
             const loc = first.file && typeof first.start === 'number'
                 ? (() => {
@@ -743,3 +890,4 @@ export class HotReloadManager {
         }
     }
 }
+exports.HotReloadManager = HotReloadManager;