almostnode 0.2.4 → 0.2.6

package/src/frameworks/tailwind-config-loader.ts

@@ -0,0 +1,206 @@
+/**
+ * Tailwind Config Loader
+ *
+ * Parses tailwind.config.ts files and generates JavaScript to configure
+ * the Tailwind CDN at runtime via window.tailwind.config.
+ */
+
+import type { VirtualFS } from '../virtual-fs';
+
+export interface TailwindConfigResult {
+  /** JavaScript code to set window.tailwind.config (empty string if no config) */
+  configScript: string;
+  /** Whether config was successfully loaded */
+  success: boolean;
+  /** Error message if loading failed */
+  error?: string;
+}
+
+/** Config file names to search for, in priority order */
+const CONFIG_FILE_NAMES = [
+  '/tailwind.config.ts',
+  '/tailwind.config.js',
+  '/tailwind.config.mjs',
+];
+
+/**
+ * Load and parse a Tailwind config file from VirtualFS
+ */
+export async function loadTailwindConfig(
+  vfs: VirtualFS,
+  root: string = '/'
+): Promise<TailwindConfigResult> {
+  // Find config file
+  let configPath: string | null = null;
+  let configContent: string | null = null;
+
+  for (const fileName of CONFIG_FILE_NAMES) {
+    const fullPath = root === '/' ? fileName : `${root}${fileName}`;
+    try {
+      const content = vfs.readFileSync(fullPath);
+      configContent =
+        typeof content === 'string'
+          ? content
+          : content instanceof Uint8Array
+            ? new TextDecoder('utf-8').decode(content)
+            : Buffer.from(content).toString('utf-8');
+      configPath = fullPath;
+      break;
+    } catch {
+      // File not found, try next
+      continue;
+    }
+  }
+
+  if (!configPath || configContent === null) {
+    return {
+      configScript: '',
+      success: true, // Not an error, just no config
+    };
+  }
+
+  try {
+    // Strip TypeScript syntax and extract config object
+    const jsConfig = stripTypescriptSyntax(configContent);
+    const configObject = extractConfigObject(jsConfig);
+
+    if (!configObject) {
+      return {
+        configScript: '',
+        success: false,
+        error: 'Could not extract config object from tailwind.config',
+      };
+    }
+
+    // Generate the script to inject
+    const configScript = generateConfigScript(configObject);
+
+    return {
+      configScript,
+      success: true,
+    };
+  } catch (error) {
+    return {
+      configScript: '',
+      success: false,
+      error: `Failed to parse tailwind.config: ${error instanceof Error ? error.message : String(error)}`,
+    };
+  }
+}
+
+/**
+ * Strip TypeScript-specific syntax from config content
+ */
+export function stripTypescriptSyntax(content: string): string {
+  let result = content;
+
+  // Remove import type statements
+  // e.g., import type { Config } from "tailwindcss"
+  result = result.replace(/import\s+type\s+\{[^}]*\}\s+from\s+['"][^'"]*['"]\s*;?\s*/g, '');
+
+  // Remove regular import statements (Config type, etc.)
+  // e.g., import { Config } from "tailwindcss"
+  result = result.replace(/import\s+\{[^}]*\}\s+from\s+['"][^'"]*['"]\s*;?\s*/g, '');
+
+  // Remove satisfies Type assertions
+  // e.g., } satisfies Config
+  result = result.replace(/\s+satisfies\s+\w+\s*$/gm, '');
+  result = result.replace(/\s+satisfies\s+\w+\s*;?\s*$/gm, '');
+
+  // Remove type annotations on variables
+  // e.g., const config: Config = { ... }
+  result = result.replace(/:\s*Config\s*=/g, ' =');
+
+  // Remove 'as const' assertions
+  result = result.replace(/\s+as\s+const\s*/g, ' ');
+
+  return result;
+}
+
+/**
+ * Extract the config object from the processed content
+ */
+export function extractConfigObject(content: string): string | null {
+  // Look for export default { ... }
+  // We need to find the opening brace and match it to the closing brace
+
+  // First, find "export default"
+  const exportDefaultMatch = content.match(/export\s+default\s*/);
+  if (!exportDefaultMatch || exportDefaultMatch.index === undefined) {
+    return null;
+  }
+
+  const startIndex = exportDefaultMatch.index + exportDefaultMatch[0].length;
+  const remaining = content.substring(startIndex);
+
+  // Check if it starts with an object literal
+  const trimmedRemaining = remaining.trimStart();
+  if (!trimmedRemaining.startsWith('{')) {
+    return null;
+  }
+
+  // Find the matching closing brace
+  const objectStart = startIndex + (remaining.length - trimmedRemaining.length);
+  const objectContent = content.substring(objectStart);
+
+  let braceCount = 0;
+  let inString = false;
+  let stringChar = '';
+  let escaped = false;
+  let endIndex = -1;
+
+  for (let i = 0; i < objectContent.length; i++) {
+    const char = objectContent[i];
+
+    if (escaped) {
+      escaped = false;
+      continue;
+    }
+
+    if (char === '\\') {
+      escaped = true;
+      continue;
+    }
+
+    if (inString) {
+      if (char === stringChar) {
+        inString = false;
+      }
+      continue;
+    }
+
+    if (char === '"' || char === "'" || char === '`') {
+      inString = true;
+      stringChar = char;
+      continue;
+    }
+
+    if (char === '{') {
+      braceCount++;
+    } else if (char === '}') {
+      braceCount--;
+      if (braceCount === 0) {
+        endIndex = i + 1;
+        break;
+      }
+    }
+  }
+
+  if (endIndex === -1) {
+    return null;
+  }
+
+  return objectContent.substring(0, endIndex);
+}
+
+/**
+ * Generate the script to inject the Tailwind config
+ */
+export function generateConfigScript(configObject: string): string {
+  // Wrap in a script that sets tailwind.config
+  // This must run AFTER the Tailwind CDN script loads
+  // The CDN creates the global `tailwind` object, then we configure it
+  return `<script>
+  tailwind.config = ${configObject};
+</script>`;
+}

package/src/frameworks/vite-dev-server.ts

@@ -6,6 +6,7 @@
 import { DevServer, DevServerOptions, ResponseData, HMRUpdate } from '../dev-server';
 import { VirtualFS } from '../virtual-fs';
 import { Buffer } from '../shims/stream';
+import { simpleHash } from '../utils/hash';
 
 // Check if we're in a real browser environment (not jsdom or Node.js)
 // jsdom has window but doesn't have ServiceWorker or SharedArrayBuffer
@@ -279,6 +280,7 @@ export class ViteDevServer extends DevServer {
   private watcherCleanup: (() => void) | null = null;
   private options: ViteDevServerOptions;
   private hmrTargetWindow: Window | null = null;
+  private transformCache: Map<string, { code: string; hash: string }> = new Map();
 
   constructor(vfs: VirtualFS, options: ViteDevServerOptions) {
     super(vfs, options);
@@ -478,8 +480,31 @@ export class ViteDevServer extends DevServer {
   private async transformAndServe(filePath: string, urlPath: string): Promise<ResponseData> {
     try {
       const content = this.vfs.readFileSync(filePath, 'utf8');
+      const hash = simpleHash(content);
+
+      // Check transform cache
+      const cached = this.transformCache.get(filePath);
+      if (cached && cached.hash === hash) {
+        const buffer = Buffer.from(cached.code);
+        return {
+          statusCode: 200,
+          statusMessage: 'OK',
+          headers: {
+            'Content-Type': 'application/javascript; charset=utf-8',
+            'Content-Length': String(buffer.length),
+            'Cache-Control': 'no-cache',
+            'X-Transformed': 'true',
+            'X-Cache': 'hit',
+          },
+          body: buffer,
+        };
+      }
+
       const transformed = await this.transformCode(content, urlPath);
 
+      // Cache the transform result
+      this.transformCache.set(filePath, { code: transformed, hash });
+
       const buffer = Buffer.from(transformed);
       return {
         statusCode: 200,

package/src/macaly-demo.ts

@@ -0,0 +1,172 @@
+/**
+ * Macaly Demo - Load the REAL macaly-web repository into almostnode
+ * This tests almostnode's ability to run a real-world Next.js app
+ */
+
+import { VirtualFS } from './virtual-fs';
+import { createRuntime } from './create-runtime';
+import type { IRuntime } from './runtime-interface';
+import { NextDevServer } from './frameworks/next-dev-server';
+import { getServerBridge } from './server-bridge';
+
+/**
+ * Files to load from the real macaly-web repository
+ * We'll populate this dynamically, but here's the structure we need
+ */
+export interface MacalyFiles {
+  [path: string]: string;
+}
+
+/**
+ * Load the real macaly-web project into VirtualFS
+ */
+export function loadMacalyProject(vfs: VirtualFS, files: MacalyFiles): void {
+  for (const [path, content] of Object.entries(files)) {
+    // Ensure directory exists
+    const dir = path.substring(0, path.lastIndexOf('/'));
+    if (dir) {
+      vfs.mkdirSync(dir, { recursive: true });
+    }
+
+    // Handle base64-encoded binary files
+    if (content.startsWith('base64:')) {
+      const base64Data = content.slice(7); // Remove 'base64:' prefix
+      const binaryData = atob(base64Data);
+      const bytes = new Uint8Array(binaryData.length);
+      for (let i = 0; i < binaryData.length; i++) {
+        bytes[i] = binaryData.charCodeAt(i);
+      }
+      vfs.writeFileSync(path, Buffer.from(bytes));
+    } else {
+      vfs.writeFileSync(path, content);
+    }
+  }
+}
+
+/**
+ * Initialize the Macaly demo with real files
+ */
+export async function initMacalyDemo(
+  outputElement: HTMLElement,
+  files: MacalyFiles,
+  options: { useWorker?: boolean } = {}
+): Promise<{ vfs: VirtualFS; runtime: IRuntime }> {
+  const { useWorker = false } = options;
+
+  const log = (message: string) => {
+    const line = document.createElement('div');
+    line.textContent = `[${new Date().toLocaleTimeString()}] ${message}`;
+    outputElement.appendChild(line);
+    outputElement.scrollTop = outputElement.scrollHeight;
+  };
+
+  log('Creating virtual file system...');
+  const vfs = new VirtualFS();
+
+  log(`Loading ${Object.keys(files).length} files from macaly-web...`);
+  loadMacalyProject(vfs, files);
+
+  log(`Initializing runtime (${useWorker ? 'Web Worker mode' : 'main thread'})...`);
+  const runtime = await createRuntime(vfs, {
+    dangerouslyAllowSameOrigin: true,
+    useWorker,
+    cwd: '/',
+    env: {
+      NODE_ENV: 'development',
+    },
+    onConsole: (method, args) => {
+      const prefix = method === 'error' ? '[ERROR]' : method === 'warn' ? '[WARN]' : '';
+      log(`${prefix} ${args.map((a) => String(a)).join(' ')}`);
+    },
+  });
+
+  if (useWorker) {
+    log('Runtime is running in a Web Worker for better UI responsiveness');
+  }
+
+  log('Setting up file watcher...');
+  vfs.watch('/app', { recursive: true }, (eventType, filename) => {
+    log(`File ${eventType}: ${filename}`);
+  });
+
+  log('Macaly demo initialized!');
+
+  return { vfs, runtime };
+}
+
+/**
+ * Start the Macaly dev server
+ */
+export async function startMacalyDevServer(
+  vfs: VirtualFS,
+  options: {
+    port?: number;
+    log?: (message: string) => void;
+  } = {}
+): Promise<{
+  server: NextDevServer;
+  url: string;
+  stop: () => void;
+}> {
+  const port = options.port || 3001;
+  const log = options.log || console.log;
+
+  log('Starting Macaly dev server...');
+
+  const server = new NextDevServer(vfs, { port, root: '/' });
+  const bridge = getServerBridge();
+
+  try {
+    log('Initializing Service Worker...');
+    await bridge.initServiceWorker();
+    log('Service Worker ready');
+  } catch (error) {
+    log(`Warning: Service Worker failed to initialize: ${error}`);
+  }
+
+  bridge.on('server-ready', (p: unknown, u: unknown) => {
+    log(`Server ready at ${u}`);
+  });
+
+  const httpServer = {
+    listening: true,
+    address: () => ({ port: server.getPort(), address: '0.0.0.0', family: 'IPv4' }),
+    async handleRequest(
+      method: string,
+      url: string,
+      headers: Record<string, string>,
+      body?: string | ArrayBuffer
+    ) {
+      const bodyBuffer = body
+        ? typeof body === 'string'
+          ? Buffer.from(body)
+          : Buffer.from(body)
+        : undefined;
+      return server.handleRequest(method, url, headers, bodyBuffer);
+    },
+  };
+
+  bridge.registerServer(httpServer as any, port);
+  server.start();
+  log('File watcher started');
+
+  server.on('hmr-update', (update: unknown) => {
+    log(`HMR update: ${JSON.stringify(update)}`);
+  });
+
+  const url = bridge.getServerUrl(port);
+  log(`Macaly dev server running at: ${url}/`);
+
+  return {
+    server,
+    url: url + '/',
+    stop: () => {
+      server.stop();
+      bridge.unregisterServer(port);
+    },
+  };
+}
+
+// Export for use in the demo page
+export { VirtualFS, NextDevServer, createRuntime };
+export type { IRuntime };

package/src/runtime.ts

@@ -7,6 +7,8 @@
 
 import { VirtualFS } from './virtual-fs';
 import type { IRuntime, IExecuteResult, IRuntimeOptions } from './runtime-interface';
+import type { PackageJson } from './types/package-json';
+import { simpleHash } from './utils/hash';
 import { createFsShim, FsShim } from './shims/fs';
 import * as pathShim from './shims/path';
 import { createProcess, Process } from './shims/process';
@@ -347,8 +349,30 @@ function createRequire(
   process: Process,
   currentDir: string,
   moduleCache: Record<string, Module>,
-  options: RuntimeOptions
+  options: RuntimeOptions,
+  processedCodeCache?: Map<string, string>
 ): RequireFunction {
+  // Module resolution cache for faster repeated imports
+  const resolutionCache: Map<string, string | null> = new Map();
+
+  // Package.json parsing cache
+  const packageJsonCache: Map<string, PackageJson | null> = new Map();
+
+  const getParsedPackageJson = (pkgPath: string): PackageJson | null => {
+    if (packageJsonCache.has(pkgPath)) {
+      return packageJsonCache.get(pkgPath)!;
+    }
+    try {
+      const content = vfs.readFileSync(pkgPath, 'utf8');
+      const parsed = JSON.parse(content) as PackageJson;
+      packageJsonCache.set(pkgPath, parsed);
+      return parsed;
+    } catch {
+      packageJsonCache.set(pkgPath, null);
+      return null;
+    }
+  };
+
   const resolveModule = (id: string, fromDir: string): string => {
     // Handle node: protocol prefix (Node.js 16+)
     if (id.startsWith('node:')) {
@@ -360,6 +384,16 @@ function createRequire(
       return id;
     }
 
+    // Check resolution cache
+    const cacheKey = `${fromDir}|${id}`;
+    const cached = resolutionCache.get(cacheKey);
+    if (cached !== undefined) {
+      if (cached === null) {
+        throw new Error(`Cannot find module '${id}'`);
+      }
+      return cached;
+    }
+
     // Relative paths
     if (id.startsWith('./') || id.startsWith('../') || id.startsWith('/')) {
       const resolved = id.startsWith('/')
@@ -370,11 +404,13 @@ function createRequire(
       if (vfs.existsSync(resolved)) {
         const stats = vfs.statSync(resolved);
         if (stats.isFile()) {
+          resolutionCache.set(cacheKey, resolved);
           return resolved;
         }
         // Directory - look for index.js
         const indexPath = pathShim.join(resolved, 'index.js');
         if (vfs.existsSync(indexPath)) {
+          resolutionCache.set(cacheKey, indexPath);
           return indexPath;
         }
       }
@@ -384,10 +420,12 @@ function createRequire(
       for (const ext of extensions) {
         const withExt = resolved + ext;
         if (vfs.existsSync(withExt)) {
+          resolutionCache.set(cacheKey, withExt);
           return withExt;
         }
       }
 
+      resolutionCache.set(cacheKey, null);
       throw new Error(`Cannot find module '${id}' from '${fromDir}'`);
     }
 
@@ -436,10 +474,8 @@ function createRequire(
       const pkgRoot = pathShim.join(nodeModulesDir, pkgName);
       const pkgPath = pathShim.join(pkgRoot, 'package.json');
 
-      if (vfs.existsSync(pkgPath)) {
-        const pkgContent = vfs.readFileSync(pkgPath, 'utf8');
-        const pkg = JSON.parse(pkgContent);
-
+      const pkg = getParsedPackageJson(pkgPath);
+      if (pkg) {
         // Use resolve.exports to handle the exports field
         if (pkg.exports) {
           try {
@@ -474,15 +510,22 @@ function createRequire(
     while (searchDir !== '/') {
       const nodeModulesDir = pathShim.join(searchDir, 'node_modules');
       const resolved = tryResolveFromNodeModules(nodeModulesDir, id);
-      if (resolved) return resolved;
+      if (resolved) {
+        resolutionCache.set(cacheKey, resolved);
+        return resolved;
+      }
 
       searchDir = pathShim.dirname(searchDir);
     }
 
     // Try root node_modules as last resort
     const rootResolved = tryResolveFromNodeModules('/node_modules', id);
-    if (rootResolved) return rootResolved;
+    if (rootResolved) {
+      resolutionCache.set(cacheKey, rootResolved);
+      return rootResolved;
+    }
 
+    resolutionCache.set(cacheKey, null);
     throw new Error(`Cannot find module '${id}'`);
   };
 
@@ -514,28 +557,40 @@ function createRequire(
     }
 
     // Read and execute JS file
-    let code = vfs.readFileSync(resolvedPath, 'utf8');
+    const rawCode = vfs.readFileSync(resolvedPath, 'utf8');
     const dirname = pathShim.dirname(resolvedPath);
 
-    // Transform ESM to CJS if needed (for .mjs files or ESM that wasn't pre-transformed)
-    // This handles files that weren't transformed during npm install
-    // BUT skip .cjs files and already-bundled CJS code
-    const isCjsFile = resolvedPath.endsWith('.cjs');
-    const isAlreadyBundledCjs = code.startsWith('"use strict";\nvar __') ||
-                                 code.startsWith("'use strict';\nvar __");
+    // Check processed code cache (useful for HMR when module cache is cleared but code hasn't changed)
+    // Use a simple hash of the content for cache key to handle content changes
+    const codeCacheKey = `${resolvedPath}|${simpleHash(rawCode)}`;
+    let code = processedCodeCache?.get(codeCacheKey);
+
+    if (!code) {
+      code = rawCode;
 
-    const hasEsmImport = /\bimport\s+[\w{*'"]/m.test(code);
-    const hasEsmExport = /\bexport\s+(?:default|const|let|var|function|class|{|\*)/m.test(code);
+      // Transform ESM to CJS if needed (for .mjs files or ESM that wasn't pre-transformed)
+      // This handles files that weren't transformed during npm install
+      // BUT skip .cjs files and already-bundled CJS code
+      const isCjsFile = resolvedPath.endsWith('.cjs');
+      const isAlreadyBundledCjs = code.startsWith('"use strict";\nvar __') ||
+                                   code.startsWith("'use strict';\nvar __");
 
-    if (!isCjsFile && !isAlreadyBundledCjs) {
-      if (resolvedPath.endsWith('.mjs') || resolvedPath.includes('/esm/') || hasEsmImport || hasEsmExport) {
-        code = transformEsmToCjs(code, resolvedPath);
+      const hasEsmImport = /\bimport\s+[\w{*'"]/m.test(code);
+      const hasEsmExport = /\bexport\s+(?:default|const|let|var|function|class|{|\*)/m.test(code);
+
+      if (!isCjsFile && !isAlreadyBundledCjs) {
+        if (resolvedPath.endsWith('.mjs') || resolvedPath.includes('/esm/') || hasEsmImport || hasEsmExport) {
+          code = transformEsmToCjs(code, resolvedPath);
+        }
       }
-    }
 
-    // Transform dynamic imports: import('x') -> __dynamicImport('x')
-    // This allows dynamic imports to work in our eval-based runtime
-    code = transformDynamicImports(code);
+      // Transform dynamic imports: import('x') -> __dynamicImport('x')
+      // This allows dynamic imports to work in our eval-based runtime
+      code = transformDynamicImports(code);
+
+      // Cache the processed code
+      processedCodeCache?.set(codeCacheKey, code);
+    }
 
     // Create require for this module
     const moduleRequire = createRequire(
@@ -544,7 +599,8 @@ function createRequire(
       process,
       dirname,
       moduleCache,
-      options
+      options,
+      processedCodeCache
     );
     moduleRequire.cache = moduleCache;
 
@@ -779,6 +835,8 @@ export class Runtime {
   private process: Process;
   private moduleCache: Record<string, Module> = {};
   private options: RuntimeOptions;
+  /** Cache for pre-processed code (after ESM transform) before eval */
+  private processedCodeCache: Map<string, string> = new Map();
 
   constructor(vfs: VirtualFS, options: RuntimeOptions = {}) {
     this.vfs = vfs;
@@ -907,7 +965,8 @@ export class Runtime {
       this.process,
       dirname,
       this.moduleCache,
-      this.options
+      this.options,
+      this.processedCodeCache
     );
 
     // Create module object

package/src/types/package-json.ts

@@ -0,0 +1,15 @@
+/**
+ * Type definition for package.json files
+ */
+export interface PackageJson {
+  name?: string;
+  version?: string;
+  main?: string;
+  module?: string;
+  types?: string;
+  exports?: Record<string, unknown> | string;
+  dependencies?: Record<string, string>;
+  devDependencies?: Record<string, string>;
+  peerDependencies?: Record<string, string>;
+  [key: string]: unknown;
+}

package/src/utils/hash.ts

@@ -0,0 +1,12 @@
+/**
+ * Simple hash function for content-based cache invalidation.
+ * Uses djb2-style hashing for fast string hashing.
+ */
+export function simpleHash(str: string): string {
+  let hash = 0;
+  for (let i = 0; i < str.length; i++) {
+    hash = ((hash << 5) - hash) + str.charCodeAt(i);
+    hash |= 0;
+  }
+  return hash.toString(36);
+}