vite-plugin-vanjs 0.1.18 → 0.1.20

package/README.md

@@ -5,7 +5,7 @@
 [![NPM Version](https://img.shields.io/npm/v/vite-plugin-vanjs.svg)](https://www.npmjs.com/package/vite-plugin-vanjs)
 [![NPM Downloads](https://img.shields.io/npm/dm/vite-plugin-vanjs.svg)](http://npm-stat.com/charts.html?package=vite-plugin-vanjs)
 
-A mini meta-framework for [VanJS](https://vanjs.org/) developed around the awesome [vite](https://vite.dev) and tested with [vitest](https://vitest.dev). The plugin comes with a set of modules to streamline your workflow:
+An async first mini meta-framework for [VanJS](https://vanjs.org/) developed around the awesome [vite](https://vite.dev) and tested with [vitest](https://vitest.dev). The plugin comes with a set of modules to streamline your workflow:
 * ***@vanjs/router*** - one of the most important part of an application which allows you to split code and lazy load page like components with ease, handles both Client Side Rendering (SSR) and Server Side Rendering (CSR) and makes it really easy to work with;
 * ***@vanjs/meta*** - allows you to create metadata for your pages as well as load additional assets with ease;
 * ***@vanjs/jsx*** - enables JSX transformation with automatic namespace resolution;

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "vite-plugin-vanjs",
-  "version": "0.1.18",
+  "version": "0.1.20",
   "author": "thednp",
   "license": "MIT",
-  "description": "A mini meta-framework for VanJS powered by Vite",
+  "description": "An async first mini meta-framework for VanJS powered by Vite",
   "repository": "https://github.com/thednp/vite-plugin-vanjs",
   "type": "module",
   "sideEffects": false,

package/plugin/helpers.mjs

@@ -7,6 +7,7 @@
 import { dirname, join, posix, win32 } from "node:path";
 import { existsSync } from "node:fs";
 import { readdir } from "node:fs/promises";
+import process from "node:process";
 
 /**
  * Get the file most probable route path for a given potential route.
@@ -194,10 +195,21 @@ export const processLayoutRoutes = (routes, config, pluginConfig) => {
  * Scan and process routes and return them
  * @type {typeof import("./types").getRoutes}
  */
-// export const scanRoutes = async (config, pluginConfig) => {}
 export const getRoutes = async (config, pluginConfig) => {
   const routes = await scanRoutes(config, pluginConfig);
-  return processLayoutRoutes(routes, config, pluginConfig);
+  const processed = processLayoutRoutes(routes, config, pluginConfig);
+  // istanbul ignore next - defaults can't be checked
+  const { excludeRoutes = [], excludeRoutesProd = [] } = pluginConfig;
+  const isProd = process.env.NODE_ENV === "production";
+  const allExcludes = [...excludeRoutes, ...(isProd ? excludeRoutesProd : [])];
+  if (allExcludes.length) {
+    return processed.filter((r) =>
+      !allExcludes.some((p) =>
+        r.routePath === p || r.routePath.startsWith(p + "/")
+      )
+    );
+  }
+  return processed;
 };
 
 /** @type {(route: RouteFile) => string} */

package/plugin/index.mjs

@@ -22,6 +22,8 @@ const toAbsolute = (p) => resolve(__dirname, p);
 const pluginDefaults = {
   routesDir: "src/routes",
   extensions: [".tsx", ".jsx", ".ts", ".js"],
+  excludeRoutes: [],
+  excludeRoutesProd: [],
 };
 
 // Define module mapping configuration

package/plugin/types.d.ts

@@ -10,6 +10,8 @@ import type { Plugin } from "vite";
 export type VanJSPluginOptions = {
   routesDir?: string;
   extensions?: string[];
+  excludeRoutes?: string[]; // NEW — excluded in all envs
+  excludeRoutesProd?: string[]; // NEW — excluded in production only
 };
 
 export declare const VitePluginVanJS: (

package/router/state.mjs

@@ -105,5 +105,8 @@ export const setRouterState = (path, search = undefined, params = {}) => {
   routerState.searchParams = new URLSearchParams(
     search || searchParams || "",
   );
+  Object.keys(routerState.params).forEach((key) =>
+    delete routerState.params[key]
+  );
   Object.assign(routerState.params, params);
 };

package/server/index.mjs

@@ -46,25 +46,17 @@ export const renderToString = async (inputSource) => {
  * @param {string} file
  * @returns {string}
  */
+// return `<link rel="preload" href="${file}" as="style" crossorigin>`;
 function renderPreloadLink(file) {
   if (file.endsWith(".js")) {
-    return `<link rel="preload" href="${file}" as="script" crossorigin>`;
+    return `<link rel="modulepreload" href="${file}" crossorigin>`;
   } else if (file.endsWith(".css")) {
-    return `<link rel="preload" href="${file}" as="style" crossorigin>`;
+    return `<link rel="stylesheet" href="${file}" crossorigin>`;
   } else if (file.endsWith(".woff")) {
-    return `  <link rel="preload" href="${file}" as="font" type="font/woff" crossorigin>`;
+    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">`;
-  } else if (file.endsWith(".jpg") || file.endsWith(".jpeg")) {
-    return `<link rel="preload" href="${file}" as="image" type="image/jpeg">`;
-  } else if (file.endsWith(".png")) {
-    return `<link rel="preload" href="${file}" as="image" type="image/png">`;
-  } else if (file.endsWith(".webp")) {
-    return `<link rel="preload" href="${file}" as="image" type="image/webp">`;
+    return `<link rel="preload" href="${file}" as="font" type="font/woff2" crossorigin>`;
   } else {
-    // @ts-ignore - this is server side code
     console.warn("Render error! File format not recognized: " + file);
     return "";
   }
@@ -131,7 +123,7 @@ export const getDataPreload = () => {
 
   if (cacheEntries.length > 0) {
     const json = JSON.stringify(cacheJSON);
-    return `<script id="data-cache">window.__DATA_CACHE=${json}</script>`;
+    return `<script id="data-cache">window.__DATA_CACHE=${json};</script>`;
   }
   return "";
 };