vite-plugin-vanjs 0.1.20 → 0.1.22

package/meta/tags.mjs

@@ -1,7 +1,8 @@
 import van from "vanjs-core";
 import { addMeta } from "./Head.mjs";
 
-/** @typedef {import("vanjs-core").PropsWithKnownKeys} PropsWithKnownKeys */
+/** @typedef {import("./types.d.ts").SupportedTags} SupportedTags */
+/** @typedef {import("vanjs-core").PropsWithKnownKeys<T = SupportedTags>} PropsWithKnownKeys<T> */
 /** @typedef {import("./types.d.ts").TagProps} TagProps */
 
 /**
@@ -31,9 +32,25 @@ export const Meta = (props) => {
 export const Link = (props) => {
   const { link } = van.tags;
   if (props.rel === "stylesheet") {
-    console.warn("Link doesn't support stylesheets.");
+    console.warn("Link doesn't support stylesheets, check the Wiki.");
   } else {
     addMeta(link(props));
   }
   return null;
 };
+
+/**
+ * Add a new `<script>` tag, not to be used for .js files
+ * Only to be used as `<script type="application/ld+json">`
+ * for SEO purposes.
+ * @type {(props: PropsWithKnownKeys<HTMLScriptElement>, content: string) => null}
+ */
+export const Script = (props, content) => {
+  const { script } = van.tags;
+  if (!props.type || props.type !== "application/ld+json") {
+    console.warn("Script doesn't support this type, check the Wiki.");
+  } else {
+    addMeta(script(props, content));
+  }
+  return null;
+};

package/meta/types.d.ts

@@ -15,6 +15,7 @@ export const initializeHeadTags: () => void | (() => Promise<void>);
 export type SupportedTags =
   | HTMLTitleElement
   | HTMLLinkElement
+  | HTMLScriptElement
   | HTMLMetaElement;
 
 export type AllHeadTags =

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-vanjs",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "author": "thednp",
   "license": "MIT",
   "description": "An async first mini meta-framework for VanJS powered by Vite",

package/router/helpers.mjs

@@ -65,14 +65,18 @@ export const executeLifecycle = async (route, params) => {
     const preload = route.preload;
     const load = route.load;
 
+    const pathname = routerState.pathname;
+    const cacheKey = Object.keys(params || {}).length === 0
+      ? ""
+      : JSON.stringify(params);
+
     if (preload) await preload(params);
-    if (!data && load) data = await load(params);
+    if (!data && load && !dataCache.has(pathname, cacheKey)) {
+      data = await load(params);
+    } else if (load && dataCache.has(pathname, cacheKey)) {
+      dataCache.touch(pathname);
+    }
     if (data) {
-      // initialLoaded = true;
-      const pathname = routerState.pathname;
-      const cacheKey = Object.keys(params || {}).length === 0
-        ? ""
-        : JSON.stringify(params);
       dataCache.set(pathname, cacheKey, {
         data,
         error: null,

package/server/index.mjs

@@ -1,5 +1,4 @@
 import { basename } from "node:path";
-// import { routerState } from "../router/index.mjs";
 import * as dataCache from "../router/dataCache.mjs";
 export * from "../plugin/helpers.mjs";
 
@@ -20,7 +19,10 @@ export const renderToString = async (inputSource) => {
   if (typeof source === "boolean") {
     return String(source);
   }
-  if (typeof source === "object" && "render" in source) {
+  if (
+    source && typeof source === "object" && "render" in source &&
+    typeof source.render === "function"
+  ) {
     return source.render();
   }
   if (source instanceof Promise) {
@@ -56,6 +58,14 @@ function renderPreloadLink(file) {
     return `<link rel="preload" href="${file}" as="font" type="font/woff" crossorigin>`;
   } else if (file.endsWith(".woff2")) {
     return `<link rel="preload" href="${file}" as="font" type="font/woff2" crossorigin>`;
+  } else if (file.endsWith(".gif")) {
+    return `<link rel="preload" href="${file}" as="image" type="image/gif" crossorigin>`;
+  } else if (file.endsWith(".jpg") || file.endsWith(".jpeg")) {
+    return `<link rel="preload" href="${file}" as="image" type="image/jpeg" crossorigin>`;
+  } else if (file.endsWith(".png")) {
+    return `<link rel="preload" href="${file}" as="image" type="image/png" crossorigin>`;
+  } else if (file.endsWith(".webp")) {
+    return `<link rel="preload" href="${file}" as="image" type="image/webp" crossorigin>`;
   } else {
     console.warn("Render error! File format not recognized: " + file);
     return "";