npm - @lolyjs/core - Versions diffs - 0.2.0-alpha.22 → 0.2.0-alpha.24 - Mend

@lolyjs/core 0.2.0-alpha.22 → 0.2.0-alpha.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/README.md CHANGED Viewed

@@ -408,13 +408,21 @@ Loly serves static files from the `public/` directory at the root of your applic
 public/
 ├── sitemap.xml      # Available at /sitemap.xml
 ├── robots.txt       # Available at /robots.txt
-├── favicon.ico      # Available at /favicon.ico
+├── favicon.ico      # Available at /favicon.ico (or favicon.png)
+├── favicon.png      # Available at /favicon.png (alternative to .ico)
 └── assets/
     ├── logo.png     # Available at /assets/logo.png
     └── images/      # Available at /assets/images/*
         └── hero.jpg
 ```
+**Favicon:**
+Place your favicon in the `public/` directory as either `favicon.ico` or `favicon.png`. The framework automatically detects and includes it in the HTML head with the correct MIME type:
+- `public/favicon.ico` → `/favicon.ico` (type: `image/x-icon`)
+- `public/favicon.png` → `/favicon.png` (type: `image/png`)
+If both exist, `favicon.ico` takes priority (checked first).
 **SEO Example:**
 Create `public/sitemap.xml`:
@@ -440,14 +448,22 @@ Sitemap: https://example.com/sitemap.xml
 Both files will be automatically available at `/sitemap.xml` and `/robots.txt` respectively, and search engines will find them at the standard locations.
+**Important Notes:**
+- **All static files** (including favicons) must be placed in the `public/` directory
+- The framework **only** looks for favicons in `public/` (not in the root or `app/` directory)
+- Favicons are automatically detected and included in the HTML `<head>` with the correct MIME type
+- Static files have **priority over dynamic routes** - perfect for SEO files
 **Configuration:**
 The static directory can be customized in `loly.config.ts`:
 ```tsx
+import type { FrameworkConfig } from "@lolyjs/core";
 export default {
   directories: {
     static: "public",  // Default: "public"
   },
-} satisfies FrameworkConfig;
+} satisfies Partial<FrameworkConfig>;
 ```
 ### 🔌 API Routes
@@ -913,30 +929,24 @@ export default function Navigation() {
 Create `loly.config.ts` in your project root to configure the framework:
 ```tsx
-import { FrameworkConfig } from "@lolyjs/core";
+import type { FrameworkConfig } from "@lolyjs/core";
+// Option 1: Partial config (only specify what you want to change)
 export default {
   directories: {
-    app: "app",
-    build: ".loly",
     static: "public",
   },
-  server: {
-    port: 3000,
-    host: "localhost",
-  },
-  routing: {
-    trailingSlash: "ignore",
-    caseSensitive: false,
-    basePath: "",
-  },
-  rendering: {
-    framework: "react",
-    streaming: true,
-    ssr: true,
-    ssg: true,
-  },
-} satisfies FrameworkConfig;
+} satisfies Partial<FrameworkConfig>;
+// Option 2: Full config (for strict validation)
+// export default {
+//   directories: { app: "app", build: ".loly", static: "public" },
+//   conventions: { /* ... */ },
+//   routing: { /* ... */ },
+//   build: { /* ... */ },
+//   server: { adapter: "express", port: 3000, host: "localhost" },
+//   rendering: { framework: "react", streaming: true, ssr: true, ssg: true },
+// } satisfies FrameworkConfig;
 ```
 ### Server Configuration

package/dist/cli.cjs CHANGED Viewed

@@ -11459,22 +11459,36 @@ function copyStaticAssets(projectRoot, outDir) {
   const assetsSrc = import_path12.default.join(projectRoot, "assets");
   const assetsDest = import_path12.default.join(outDir, "assets");
   copyDirRecursive(assetsSrc, assetsDest);
-  const appDir = import_path12.default.join(projectRoot, "app");
+  const publicDir = import_path12.default.join(projectRoot, "public");
   const candidates = ["favicon.ico", "favicon.png"];
   for (const name of candidates) {
-    const fromApp = import_path12.default.join(appDir, name);
-    const fromRoot = import_path12.default.join(projectRoot, name);
-    let src = null;
-    if (import_fs10.default.existsSync(fromApp)) src = fromApp;
-    else if (import_fs10.default.existsSync(fromRoot)) src = fromRoot;
-    if (src) {
+    const fromPublic = import_path12.default.join(publicDir, name);
+    if (import_fs10.default.existsSync(fromPublic)) {
       const dest = import_path12.default.join(outDir, name);
       ensureDir(import_path12.default.dirname(dest));
-      import_fs10.default.copyFileSync(src, dest);
+      import_fs10.default.copyFileSync(fromPublic, dest);
       break;
     }
   }
 }
+function getFaviconInfo(projectRoot, staticDir = "public", isDev = false) {
+  const candidates = [
+    { name: "favicon.ico", type: "image/x-icon" },
+    { name: "favicon.png", type: "image/png" }
+  ];
+  const publicDir = import_path12.default.join(projectRoot, staticDir);
+  for (const candidate of candidates) {
+    const publicPath = import_path12.default.join(publicDir, candidate.name);
+    if (import_fs10.default.existsSync(publicPath)) {
+      return {
+        path: `/${candidate.name}`,
+        // Served at root from public/
+        type: candidate.type
+      };
+    }
+  }
+  return null;
+}
 function generateAssetManifest(outDir, stats) {
   const manifest = {
     client: {
@@ -11959,8 +11973,12 @@ function createDocumentTree(options) {
     clientJsPath = "/static/client.js",
     clientCssPath = "/static/client.css",
     nonce,
-    includeInlineScripts = true
+    includeInlineScripts = true,
     // Default true - scripts inline in body for both SSR and SSG
+    faviconPath = FAVICON_PATH,
+    // Default to /static/favicon.png for backward compatibility
+    faviconType = "image/png"
+    // Default to PNG for backward compatibility
   } = options;
   const metaObj = meta ?? null;
   const title = metaObj?.title ?? titleFallback ?? "My Framework Dev";
@@ -12267,10 +12285,11 @@ function createDocumentTree(options) {
         href: chunkHref,
         as: "script"
       }),
-      import_react.default.createElement("link", {
+      faviconPath && import_react.default.createElement("link", {
+        key: "favicon",
         rel: "icon",
-        href: FAVICON_PATH,
-        type: "image/png"
+        href: faviconPath,
+        type: faviconType || (faviconPath.endsWith(".ico") ? "image/x-icon" : "image/png")
       }),
       import_react.default.createElement("link", {
         rel: "stylesheet",
@@ -12800,7 +12819,7 @@ async function handlePageRequest(options) {
     const { errorPage, req, res, routeChunks, theme, projectRoot } = options;
     const reqLogger = getRequestLogger(req);
     if (errorPage) {
-      await renderErrorPageWithStream(errorPage, req, res, error, routeChunks || {}, theme, projectRoot, options.env);
+      await renderErrorPageWithStream(errorPage, req, res, error, routeChunks || {}, theme, projectRoot, options.env, options.config);
     } else {
       reqLogger.error("Unhandled error in page request", error, {
         urlPath: options.urlPath,
@@ -12826,11 +12845,13 @@ async function handlePageRequestInternal(options) {
     env = "dev",
     ssgOutDir,
     theme,
-    projectRoot
+    projectRoot,
+    config
   } = options;
   const clientJsPath = env === "dev" ? "/static/client.js" : projectRoot ? getClientJsPath(projectRoot) : "/static/client.js";
   const clientCssPath = env === "dev" ? "/static/client.css" : projectRoot ? getClientCssPath(projectRoot) : "/static/client.css";
   const assetManifest = env === "prod" && projectRoot ? loadAssetManifest(projectRoot) : null;
+  const faviconInfo = projectRoot && config ? getFaviconInfo(projectRoot, config.directories.static, env === "dev") : null;
   const isDataReq = isDataRequest(req);
   const skipLayoutHooks = isDataReq && req.headers["x-skip-layout-hooks"] === "true";
   if (env === "prod" && ssgOutDir) {
@@ -12945,7 +12966,9 @@ async function handlePageRequestInternal(options) {
         theme,
         clientJsPath,
         clientCssPath,
-        nonce: nonce2
+        nonce: nonce2,
+        faviconPath: faviconInfo?.path || null,
+        faviconType: faviconInfo?.type || null
       });
       let didError2 = false;
       const { pipe: pipe2, abort: abort2 } = (0, import_server.renderToPipeableStream)(documentTree2, {
@@ -12960,7 +12983,7 @@ async function handlePageRequestInternal(options) {
           const reqLogger2 = getRequestLogger(req);
           reqLogger2.error("SSR shell error", err, { route: "not-found" });
           if (!res.headersSent && errorPage) {
-            renderErrorPageWithStream(errorPage, req, res, err, routeChunks, theme, projectRoot, env);
+            renderErrorPageWithStream(errorPage, req, res, err, routeChunks, theme, projectRoot, env, config);
           } else if (!res.headersSent) {
             res.statusCode = 500;
             res.setHeader("Content-Type", "text/html; charset=utf-8");
@@ -13075,7 +13098,7 @@ async function handlePageRequestInternal(options) {
       return;
     } else {
       if (errorPage) {
-        await renderErrorPageWithStream(errorPage, req, res, error, routeChunks, theme, projectRoot, env);
+        await renderErrorPageWithStream(errorPage, req, res, error, routeChunks, theme, projectRoot, env, config);
         return;
       } else {
         throw error;
@@ -13153,7 +13176,9 @@ async function handlePageRequestInternal(options) {
     theme,
     clientJsPath,
     clientCssPath,
-    nonce
+    nonce,
+    faviconPath: faviconInfo?.path || null,
+    faviconType: faviconInfo?.type || null
   });
   let didError = false;
   const { pipe, abort } = (0, import_server.renderToPipeableStream)(documentTree, {
@@ -13201,7 +13226,7 @@ async function handlePageRequestInternal(options) {
     abort();
   });
 }
-async function renderErrorPageWithStream(errorPage, req, res, error, routeChunks, theme, projectRoot, env = "dev") {
+async function renderErrorPageWithStream(errorPage, req, res, error, routeChunks, theme, projectRoot, env = "dev", config) {
   try {
     const isDataReq = isDataRequest(req);
     const skipLayoutHooks = isDataReq && req.headers["x-skip-layout-hooks"] === "true";
@@ -13212,6 +13237,7 @@ async function renderErrorPageWithStream(errorPage, req, res, error, routeChunks
       pathname: req.path,
       locals: { error }
     };
+    const faviconInfo = projectRoot && config ? getFaviconInfo(projectRoot, config.directories.static, env === "dev") : null;
     const layoutProps = {};
     const reqLogger = getRequestLogger(req);
     if (!skipLayoutHooks && errorPage.layoutServerHooks && errorPage.layoutServerHooks.length > 0) {
@@ -13317,7 +13343,9 @@ async function renderErrorPageWithStream(errorPage, req, res, error, routeChunks
       theme,
       clientJsPath,
       clientCssPath,
-      nonce
+      nonce,
+      faviconPath: faviconInfo?.path || null,
+      faviconType: faviconInfo?.type || null
     });
     let didError = false;
     const { pipe, abort } = (0, import_server.renderToPipeableStream)(documentTree, {
@@ -13361,11 +13389,12 @@ async function renderErrorPageWithStream(errorPage, req, res, error, routeChunks
 }
 // modules/build/ssg/renderer.ts
-async function renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params) {
+async function renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params, config) {
   const routeChunks = loadChunksFromManifest(projectRoot);
   const assetManifest = loadAssetManifest(projectRoot);
   const clientJsPath = getClientJsPath(projectRoot);
   const clientCssPath = getClientCssPath(projectRoot);
+  const faviconInfo = config ? getFaviconInfo(projectRoot, config.directories.static, false) : null;
   const chunkName = routeChunks[route.pattern];
   let chunkHref = null;
   if (chunkName != null) {
@@ -13473,8 +13502,10 @@ async function renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params)
     entrypointFiles,
     clientJsPath,
     clientCssPath,
-    includeInlineScripts: true
+    includeInlineScripts: true,
     // SSG needs inline scripts (renderToString doesn't support bootstrapScripts)
+    faviconPath: faviconInfo?.path || null,
+    faviconType: faviconInfo?.type || null
   });
   const html = "<!DOCTYPE html>" + (0, import_server2.renderToString)(documentTree);
   const dir = pathToOutDir(ssgOutDir, urlPath);
@@ -13487,7 +13518,7 @@ async function renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params)
 // modules/build/ssg/builder.ts
 init_globals();
-async function buildStaticPages(projectRoot, routes) {
+async function buildStaticPages(projectRoot, routes, config) {
   const ssgOutDir = import_path22.default.join(projectRoot, BUILD_FOLDER_NAME, "ssg");
   ensureDir(ssgOutDir);
   for (const route of routes) {
@@ -13536,7 +13567,7 @@ async function buildStaticPages(projectRoot, routes) {
     }
     for (const params of allParams) {
       const urlPath = buildPathFromPattern(route.pattern, params);
-      await renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params);
+      await renderStaticRoute(projectRoot, ssgOutDir, route, urlPath, params, config);
     }
   }
   console.log(`\u2705 [framework][ssg] Finished building all static pages`);
@@ -14185,7 +14216,7 @@ async function buildApp(options = {}) {
   writeClientBoostrapManifest(projectRoot);
   writeClientRoutesManifest(routes, projectRoot);
   await buildClientBundle(projectRoot);
-  await buildStaticPages(projectRoot, routes);
+  await buildStaticPages(projectRoot, routes, config);
   delete process.env.LOLY_BUILD;
   console.log(`[framework][build] Build completed successfully`);
 }
@@ -16427,7 +16458,8 @@ function setupRoutes(options) {
       env: isDev ? "dev" : "prod",
       ssgOutDir,
       theme: req.cookies?.theme || "light",
-      projectRoot
+      projectRoot,
+      config
     });
   });
 }