Fix blank page: anti-flash must exist in DOM before theme-init.js runs

ROOT CAUSE:
inject.scripts (theme-init.js) was emitted BEFORE inject.headFragments
(anti-flash cloak). When theme-init.js ran to remove the cloak, the
<style id="less-anti-flash"> element didn't exist yet because the HTML
parser hadn't reached it. The cloak was applied AFTER theme-init.js ran,
and never removed -> page stays visibility:hidden forever.

Fix: swap order in index.ts — headFragments first, then scripts.

Also:
- Restore PWA (was incorrectly disabled)
- Fix SW: only intercept same-origin requests (cross-origin CDN/analytics
  pass through). networkFirst returns 503 fallback instead of throwing.

Author: SisyphusZheng

packages/adapter-vite/src/cli/ssg-render.ts

@@ -372,7 +372,8 @@ self.addEventListener('activate', (e) => e.waitUntil(
 ));
 self.addEventListener('fetch', (e) => {
   const url = new URL(e.request.url);
-  if (!url.protocol.startsWith('http')) return;
+  // Only handle same-origin requests — cross-origin (CDN, analytics) pass through
+  if (url.origin !== location.origin || !url.protocol.startsWith('http')) return;
   const isAsset = /\\.[a-z0-9]+$/i.test(url.pathname) && !url.pathname.includes('/api/');
   e.respondWith(
     (isAsset ? cacheFirst(e.request) : networkFirst(e.request))
@@ -400,7 +401,8 @@ async function networkFirst(req) {
   } catch {
     const cached = await caches.match(req);
     if (cached) return cached;
-    throw new Error('offline');
+    // Return a fallback rather than throwing — prevents unhandled rejections
+    return new Response('offline', { status: 503 });
   }
 }`;
     writeFileSync(join(outputDir, 'sw.js'), swCode);

packages/adapter-vite/src/index.ts

@@ -236,11 +236,29 @@ export function less(options: FrameworkOptions = {}, externalCtx?: LessBuildCont
 
   if (options.inject && !headExtras) {
     const fragments: string[] = [];
+
+    // headFragments FIRST (meta, styles, anti-flash) — must exist in DOM
+    // before scripts that reference them (e.g. theme-init.js removes anti-flash).
+    for (const frag of options.inject.headFragments || []) {
+      // Security: warn if fragment contains inline <script> tags
+      if (/<script[\s>]/i.test(frag)) {
+        log.warn(
+          'inject.headFragments contains <script> tags. Ensure this content is ' +
+            'developer-controlled, not user-supplied, to prevent XSS. For safe URL injection, ' +
+            'use inject.scripts instead.',
+        );
+      }
+      fragments.push(frag);
+    }
+
+    // Stylesheets second
     for (const href of options.inject.stylesheets || []) {
       validateSafeUrl(href, 'inject.stylesheets');
       const safeHref = escapeHtmlAttr(href);
       fragments.push(`<link rel="stylesheet" href="${safeHref}" />`);
     }
+
+    // Scripts last — depend on headFragments being in DOM
     for (const script of options.inject.scripts || []) {
       const isObjectScript = typeof script === 'object';
       const src = isObjectScript ? script.src : script;
@@ -264,17 +282,6 @@ export function less(options: FrameworkOptions = {}, externalCtx?: LessBuildCont
         .join(' ');
       fragments.push(`<script ${attrText}></script>`);
     }
-    for (const frag of options.inject.headFragments || []) {
-      // Security: warn if fragment contains inline <script> tags
-      if (/<script[\s>]/i.test(frag)) {
-        log.warn(
-          'inject.headFragments contains <script> tags. Ensure this content is ' +
-            'developer-controlled, not user-supplied, to prevent XSS. For safe URL injection, ' +
-            'use inject.scripts instead.',
-        );
-      }
-      fragments.push(frag);
-    }
     headExtras = fragments.join('\n  ');
     allowHeadExtrasScripts = true;
   }

www/vite.config.ts

@@ -71,9 +71,12 @@ export default defineConfig({
       ssr: {
         noExternal: ['@lessjs/ui'],
       },
-      // PWA disabled for now — the service worker blocks goatcounter and
-      // other cross-origin requests, causing console errors and page load issues.
-      // pwa: { ... },
+      pwa: {
+        name: 'LessJS Framework — Less is More',
+        shortName: 'LessJS',
+        themeColor: '#000000',
+        backgroundColor: '#ffffff',
+      },
       viewTransition: true,
       speculation: true,
       inject: {