@aklinker1/aframe 0.2.0 → 0.2.2

package/README.md

@@ -104,5 +104,25 @@ When importing a file as text, like an HTML template or a `.gql` schema, you sho
 
 ```ts
 // server/main.ts
-import welcomeEmailTemplate from './assets/email-templates/welcome.html' with { type: "text" };
+import welcomeEmailTemplate from "./assets/email-templates/welcome.html" with { type: "text" };
+```
+
+## Detecting Prerender
+
+When prerendering, the page is loaded with the `?prerendering` query param.
+
+Aframe provides a helper for checking this, `isPrerendering`:
+
+```vue
+<!-- ClientOnly.vue -->
+<script setup lang="ts">
+import { isPrerendering } from "@aklinker1/aframe/app";
+
+const visible = !isPrerendering();
+</script>
+
+<template>
+  <slot v-if="visible" />
+  <slot v-else name="fallback" />
+</template>
 ```

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@aklinker1/aframe",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "packageManager": "bun@1.2.2",
   "type": "module",
   "license": "MIT",
   "exports": {
     ".": "./src/index.ts",
-    "./server": "./src/server.ts",
+    "./server": "./src/client/server.ts",
+    "./app": "./src/client/app.ts",
     "./env": "./src/env.d.ts"
   },
   "bin": {

package/src/client/app.ts

@@ -0,0 +1,6 @@
+/**
+ * Return's `true` when the app is prerendering (when URL includes `?prerendering`).
+ */
+export function isPrerendering() {
+  return new URL(location.href).searchParams.has("prerendering");
+}

package/src/config.ts

@@ -6,7 +6,7 @@ import { mkdir } from "node:fs/promises";
 export type UserConfig = {
   vite?: vite.UserConfigExport;
   prerenderedRoutes?: string[];
-  prerenderer?: PrerendererOptions;
+  prerenderer?: Partial<PrerendererOptions>;
 };
 
 export type ResolvedConfig = {

package/src/index.ts

@@ -1,13 +1,12 @@
-import * as vite from "vite";
 import Prerenderer from "@prerenderer/prerenderer";
-import type { PrerendererOptions } from "@prerenderer/prerenderer";
-import { resolve, join, relative } from "node:path/posix";
-import { mkdir, rm, writeFile } from "node:fs/promises";
-import { lstatSync } from "node:fs";
 import type { BunPlugin } from "bun";
-import { RESET, DIM, GREEN, BLUE, MAGENTA, CYAN, BOLD } from "./color";
+import { lstatSync } from "node:fs";
+import { mkdir, rm, writeFile } from "node:fs/promises";
+import { join, relative } from "node:path/posix";
+import * as vite from "vite";
+import { BLUE, BOLD, CYAN, DIM, GREEN, MAGENTA, RESET } from "./color";
+import type { ResolvedConfig } from "./config";
 import { createTimer } from "./timer";
-import { type ResolvedConfig, resolveConfig } from "./config";
 
 export * from "./config";
 
@@ -66,7 +65,11 @@ export async function build(config: ResolvedConfig) {
   const prerenderer = new Prerenderer(await config.prerenderer());
   const prerendered = await prerenderer
     .initialize()
-    .then(() => prerenderer.renderRoutes(config.prerenderedRoutes))
+    .then(() =>
+      prerenderer.renderRoutes(
+        config.prerenderedRoutes.map((route) => `${route}?prerender`),
+      ),
+    )
     .then((renderedRoutes) =>
       Promise.all(
         renderedRoutes.map(async (route) => {