@rettangoli/sites 0.2.0-rc3 → 0.2.0-rc5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rettangoli/sites",
-  "version": "0.2.0-rc3",
+  "version": "0.2.0-rc5",
   "description": "Generate static sites using Markdown and YAML. Straightforward, zero-complexity. Complete toolkit for landing pages, blogs, documentation, admin dashboards, and more.git remote add origin git@github.com:yuusoft-org/sitic.git",
   "author": {
     "name": "Luciano Hanyon Wu",
@@ -17,7 +17,7 @@
     "templates"
   ],
   "dependencies": {
-    "jempl": "^0.2.0-rc1",
+    "jempl": "^0.3.1-rc1",
     "js-yaml": "^4.1.0",
     "markdown-it": "^14.1.0",
     "playwright": "^1.55.0",

package/src/cli/build.js

@@ -1,6 +1,6 @@
 import fs from 'fs';
-import path from 'path';
 import { createSiteBuilder } from '../createSiteBuilder.js';
+import { loadSiteConfig } from '../utils/loadSiteConfig.js';
 
 /**
  * Build the static site
@@ -10,27 +10,21 @@ import { createSiteBuilder } from '../createSiteBuilder.js';
  * @param {boolean} options.quiet - Suppress build output logs
  */
 export const buildSite = async (options = {}) => {
-  const { rootDir = process.cwd(), mdRender, quiet = false } = options;
-  
-  // Try to load config file if it exists
+  const { rootDir = process.cwd(), mdRender, functions, quiet = false } = options;
+
+  // Load config file if needed
   let config = {};
-  if (!mdRender) {
-    try {
-      const configPath = path.join(rootDir, 'sites.config.js');
-      const configModule = await import(configPath);
-      config = configModule.default || {};
-    } catch (e) {
-      // Config file is optional, continue without it
-    }
+  if (!mdRender || !functions) {
+    config = await loadSiteConfig(rootDir);
   }
 
-  const build = createSiteBuilder({ 
-    fs, 
+  const build = createSiteBuilder({
+    fs,
     rootDir,
     mdRender: mdRender || config.mdRender,
-    functions: config.functions || {},
+    functions: functions || config.functions || {},
     quiet
   });
-  
+
   build();
 };

package/src/cli/watch.js

@@ -1,9 +1,11 @@
 import fs, { watch, existsSync } from 'node:fs';
 import http from 'node:http';
 import path from 'node:path';
+import { pathToFileURL } from 'node:url';
 import { WebSocketServer } from 'ws';
 import { buildSite } from './build.js';
 import ScreenshotCapture from './screenshot.js';
+import { loadSiteConfig } from '../utils/loadSiteConfig.js';
 
 // Client script to inject into HTML pages
 const CLIENT_SCRIPT = `
@@ -74,16 +76,16 @@ class DevServer {
     // Create WebSocket server
     this.wss = new WebSocketServer({ server: this.httpServer });
     console.log('WebSocket server created');
-    
+
     this.wss.on('connection', (ws) => {
       console.log('✅ Client connected. Total clients:', this.clients.size + 1);
       this.clients.add(ws);
-      
+
       ws.on('close', () => {
         console.log('❌ Client disconnected. Remaining clients:', this.clients.size - 1);
         this.clients.delete(ws);
       });
-      
+
       ws.on('error', (err) => {
         console.error('❌ WebSocket error:', err);
         this.clients.delete(ws);
@@ -103,21 +105,21 @@ class DevServer {
     const urlParts = req.url.split('?');
     let urlPath = urlParts[0];
     const queryString = urlParts[1] || '';
-    
+
     // Check if this is a screenshot request
     const isScreenshotRequest = queryString.includes('screenshot=true');
-    
+
     // Default to index.html for root
     if (urlPath === '/') {
       urlPath = '/index.html';
     }
-    
+
     // Handle trailing slash - remove it for processing
     const hasTrailingSlash = urlPath.endsWith('/') && urlPath !== '/';
     if (hasTrailingSlash) {
       urlPath = urlPath.slice(0, -1);
     }
-    
+
     // Handle paths without extensions
     if (!path.extname(urlPath)) {
       // First try as .html file
@@ -132,16 +134,16 @@ class DevServer {
         }
       }
     }
-    
+
     const filePath = path.join(this.siteDir, urlPath);
-    
+
     // Check if file exists
     if (!existsSync(filePath)) {
       res.writeHead(404);
       res.end('404 Not Found');
       return;
     }
-    
+
     // Check if it's a directory
     const stats = fs.statSync(filePath);
     if (stats.isDirectory()) {
@@ -155,18 +157,18 @@ class DevServer {
         return;
       }
     }
-    
+
     // Serve the file
     this.serveFile(filePath, res, isScreenshotRequest);
   }
-  
+
   serveFile(filePath, res, skipWebSocket = false) {
     const ext = path.extname(filePath);
     const contentType = this.getContentType(ext);
-    
+
     try {
       let content = fs.readFileSync(filePath);
-      
+
       // Inject client script into HTML files (unless it's a screenshot request)
       if (ext === '.html' && !skipWebSocket) {
         content = content.toString();
@@ -179,7 +181,7 @@ class DevServer {
           content = content + CLIENT_SCRIPT;
         }
       }
-      
+
       res.writeHead(200, { 'Content-Type': contentType });
       res.end(content);
     } catch (err) {
@@ -206,12 +208,12 @@ class DevServer {
 
   reloadAll() {
     console.log('📤 Sending reload message to', this.clients.size, 'clients');
-    
+
     // Send a simple reload command to all clients
     const message = JSON.stringify({
       type: 'reload-current'
     });
-    
+
     let sentCount = 0;
     this.clients.forEach(client => {
       if (client.readyState === 1) { // WebSocket.OPEN
@@ -219,7 +221,7 @@ class DevServer {
         sentCount++;
       }
     });
-    
+
     console.log('✅ Reload message sent to', sentCount, 'clients');
   }
 
@@ -233,29 +235,38 @@ class DevServer {
 const setupWatcher = (directory, options, server, screenshotCapture) => {
   let debounceTimer = null;
   let pendingFiles = new Set();
-  
+
   const processChanges = async () => {
     const files = [...pendingFiles];
     pendingFiles.clear();
-    
+
     console.log('Rebuilding site...');
     try {
-      await buildSite({ ...options, quiet: true });
-      console.log('Rebuild complete');
+      // Always reload config on rebuild to pick up function changes
+      const config = await loadSiteConfig(options.rootDir, true, true);
       
+      const currentOptions = {
+        ...options,
+        mdRender: config.mdRender || options.mdRender,
+        functions: config.functions || options.functions || {}
+      };
+
+      await buildSite({ ...currentOptions, quiet: true });
+      console.log('Rebuild complete');
+
       // Just reload all clients - they'll reload their current page
       console.log('🔄 Reloading all connected clients');
       server.reloadAll();
-      
+
       // If screenshots are enabled and pages were changed, capture screenshots
-      const pageFiles = files.filter(file => 
+      const pageFiles = files.filter(file =>
         (file.includes('pages/') || file.startsWith('pages/')) &&
         (file.endsWith('.md') || file.endsWith('.yaml') || file.endsWith('.yml'))
       );
       if (screenshotCapture && pageFiles.length > 0) {
         // Wait a bit for the server to be ready with new content
         await new Promise(resolve => setTimeout(resolve, 1000));
-        
+
         console.log('📸 Capturing screenshots for changed pages...');
         // Capture screenshots for changed pages
         for (const file of pageFiles) {
@@ -264,12 +275,12 @@ const setupWatcher = (directory, options, server, screenshotCapture) => {
           await screenshotCapture.capturePageScreenshot(file);
         }
       }
-      
+
     } catch (error) {
       console.error('Error during rebuild:', error);
     }
   };
-  
+
   watch(
     directory,
     { recursive: true },
@@ -279,35 +290,35 @@ const setupWatcher = (directory, options, server, screenshotCapture) => {
         if (filename.endsWith('~') || filename.startsWith('.') || filename.includes('/.')) {
           return;
         }
-        
+
         // Skip _site directory if it somehow gets included
         if (filename.includes('_site/')) {
           return;
         }
-        
+
         // For static directory, only rebuild for content files, not binary files
         const isStaticDir = directory.endsWith('/static') || directory.includes('/static/');
         if (isStaticDir) {
           const ext = path.extname(filename).toLowerCase();
           const binaryExts = ['.png', '.jpg', '.jpeg', '.gif', '.ico', '.pdf', '.zip', '.woff', '.woff2', '.ttf', '.eot'];
-          
+
           if (binaryExts.includes(ext)) {
             // For binary files in static, just copy them without full rebuild
             console.log(`📁 Static file changed: ${directory}/${filename} (skipping rebuild)`);
             return;
           }
         }
-        
+
         console.log(`Detected ${event} in ${filename}`);
-        
+
         // Add to pending files for rebuild
         const fullPath = path.join(directory, filename);
         pendingFiles.add(fullPath);
-        
+
         if (debounceTimer) {
           clearTimeout(debounceTimer);
         }
-        
+
         debounceTimer = setTimeout(processChanges, 10);
       }
     },
@@ -316,15 +327,38 @@ const setupWatcher = (directory, options, server, screenshotCapture) => {
 
 // Main watch function
 const watchSite = async (options = {}) => {
-  const { 
+  const {
     port = 3001,
-    rootDir = '.',
+    rootDir = process.cwd(),
     screenshots = false
   } = options;
 
-  // Do initial build
+  // Load config file
+  console.log(`📁 Current working directory: ${process.cwd()}`);
+  console.log(`📁 rootDir parameter: ${rootDir}`);
+  const config = await loadSiteConfig(rootDir, false);
+  
+  if (Object.keys(config).length > 0) {
+    console.log('✅ Loaded sites.config.js');
+    if (config.mdRender) {
+      console.log('✅ Custom mdRender function found');
+    } else {
+      console.log('ℹ️  No custom mdRender function in config');
+    }
+    if (config.functions) {
+      console.log(`✅ Found ${Object.keys(config.functions).length} custom function(s)`);
+    }
+  } else {
+    console.log('ℹ️  No sites.config.js found, using defaults');
+  }
+
+  // Do initial build with config
   console.log('Starting initial build...');
-  await buildSite({ rootDir });
+  await buildSite({
+    rootDir,
+    mdRender: config.mdRender,
+    functions: config.functions || {}
+  });
   console.log('Initial build complete');
 
   // Start custom dev server
@@ -341,12 +375,16 @@ const watchSite = async (options = {}) => {
 
   // Watch all relevant directories
   const dirsToWatch = ['data', 'templates', 'partials', 'pages'];
-  
+
   dirsToWatch.forEach(dir => {
     const dirPath = path.join(rootDir, dir);
     if (existsSync(dirPath)) {
       console.log(`👁️  Watching: ${dir}/`);
-      setupWatcher(dirPath, { rootDir }, server, screenshotCapture);
+      setupWatcher(dirPath, {
+        rootDir,
+        mdRender: config.mdRender,
+        functions: config.functions || {}
+      }, server, screenshotCapture);
     }
   });
 
@@ -359,7 +397,7 @@ const watchSite = async (options = {}) => {
     server.close();
     process.exit();
   });
-  
+
   process.on('SIGTERM', async () => {
     if (screenshotCapture) {
       await screenshotCapture.close();
@@ -369,4 +407,4 @@ const watchSite = async (options = {}) => {
   });
 };
 
-export default watchSite;
+export default watchSite;

package/src/createSiteBuilder.js

@@ -120,7 +120,7 @@ export function createSiteBuilder({ fs, rootDir = '.', mdRender, functions = {},
           } else if (item.isFile() && (item.name.endsWith('.yaml') || item.name.endsWith('.md'))) {
             // Extract frontmatter
             const frontmatter = extractFrontmatter(itemPath);
-            
+
             // Calculate URL
             const outputFileName = item.name.replace(/\.(yaml|md)$/, '.html');
             const outputRelativePath = basePath ? path.join(basePath, outputFileName) : outputFileName;
@@ -130,7 +130,7 @@ export function createSiteBuilder({ fs, rootDir = '.', mdRender, functions = {},
             if (frontmatter.tags) {
               // Normalize tags to array
               const tags = Array.isArray(frontmatter.tags) ? frontmatter.tags : [frontmatter.tags];
-              
+
               // Add to collections
               tags.forEach(tag => {
                 if (typeof tag === 'string' && tag.trim()) {
@@ -296,25 +296,25 @@ export function createSiteBuilder({ fs, rootDir = '.', mdRender, functions = {},
     function copyStaticFiles() {
       const staticDir = path.join(rootDir, 'static');
       const outputDir = path.join(rootDir, '_site');
-      
+
       if (!fs.existsSync(staticDir)) {
         return;
       }
-      
+
       // Ensure output directory exists
       if (!fs.existsSync(outputDir)) {
         fs.mkdirSync(outputDir, { recursive: true });
       }
-      
+
       function copyRecursive(src, dest) {
         const stats = fs.statSync(src);
-        
+
         if (stats.isDirectory()) {
           // Create directory if it doesn't exist
           if (!fs.existsSync(dest)) {
             fs.mkdirSync(dest, { recursive: true });
           }
-          
+
           // Copy all items in directory
           const items = fs.readdirSync(src);
           items.forEach(item => {
@@ -326,7 +326,7 @@ export function createSiteBuilder({ fs, rootDir = '.', mdRender, functions = {},
           if (!quiet) console.log(`  -> Copied ${src} to ${dest}`);
         }
       }
-      
+
       if (!quiet) console.log('Copying static files...');
       const items = fs.readdirSync(staticDir);
       items.forEach(item => {
@@ -338,13 +338,13 @@ export function createSiteBuilder({ fs, rootDir = '.', mdRender, functions = {},
 
     // Start build process
     if (!quiet) console.log('Starting build process...');
-    
+
     // Copy static files first (they can be overwritten by pages)
     copyStaticFiles();
-    
+
     // Process all pages (can overwrite static files)
     processAllPages('');
-    
+
     if (!quiet) console.log('Build complete!');
   };
 }

package/src/utils/loadSiteConfig.js

@@ -0,0 +1,36 @@
+import path from 'path';
+import { pathToFileURL } from 'url';
+
+/**
+ * Load the sites.config.js file from a given directory
+ * @param {string} rootDir - The root directory to look for sites.config.js
+ * @param {boolean} throwOnError - Whether to throw on errors other than file not found
+ * @param {boolean} bustCache - Whether to bypass module cache (for reloading)
+ * @returns {Promise<Object>} The loaded config object or empty object if not found
+ */
+export async function loadSiteConfig(rootDir, throwOnError = true, bustCache = false) {
+  try {
+    const configPath = path.join(rootDir, 'sites.config.js');
+    let importUrl = pathToFileURL(configPath).href;
+    
+    // Add timestamp to force reload if cache busting is requested
+    if (bustCache) {
+      importUrl += `?t=${Date.now()}`;
+    }
+    
+    const configModule = await import(importUrl);
+    return configModule.default || {};
+  } catch (e) {
+    // Only ignore file not found errors
+    if (e.code === 'ENOENT') {
+      // Config file is optional, return empty config
+      return {};
+    } else if (throwOnError) {
+      // Re-throw any other errors (syntax errors, module not found, etc.)
+      throw e;
+    } else {
+      console.error('Error loading sites.config.js:', e);
+      return {};
+    }
+  }
+}