vite-plugin-vanjs 0.1.11 → 0.1.13

package/README.md

@@ -4,11 +4,6 @@
 [![ci](https://github.com/thednp/vite-plugin-vanjs/actions/workflows/ci.yml/badge.svg)](https://github.com/thednp/vite-plugin-vanjs/actions/workflows/ci.yml)
 [![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)
-[![typescript version](https://img.shields.io/badge/typescript-5.6.2-brightgreen)](https://www.typescriptlang.org/)
-[![vanjs-core version](https://img.shields.io/badge/vanjs--core-1.6.0-brightgreen)](https://github.com/vanjs-org/van)
-[![mini-van-plate version](https://img.shields.io/badge/mini--van--plate-0.6.3-brightgreen)](https://github.com/vanjs-org/mini-van-plate)
-[![vitest version](https://img.shields.io/badge/vitest-3.2.4-brightgreen)](https://www.vitest.dev/)
-[![vite version](https://img.shields.io/badge/vite-6.4.1-brightgreen)](https://vite.dev)
 
 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:
 * ***@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;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-vanjs",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "author": "thednp",
   "license": "MIT",
   "description": "A mini meta-framework for VanJS powered by Vite",
@@ -87,14 +87,14 @@
     "vanjs-ext": "^0.6.3"
   },
   "devDependencies": {
-    "@types/node": "^22.19.15",
-    "@vitest/browser": "^3.2.4",
-    "@vitest/coverage-istanbul": "^3.2.4",
-    "@vitest/ui": "^3.2.4",
-    "happy-dom": "^16.8.1",
-    "typescript": "5.6.2",
-    "vite": "^6.4.1",
-    "vitest": "^3.2.4"
+    "@types/node": "^25.5.0",
+    "@vitest/browser": "^4.1.2",
+    "@vitest/coverage-istanbul": "^4.1.2",
+    "@vitest/ui": "^4.1.2",
+    "happy-dom": "^20.8.9",
+    "typescript": "6.0.2",
+    "vite": "^8.0.3",
+    "vitest": "^4.1.2"
   },
   "engines": {
     "node": ">=20",

package/plugin/index.mjs

@@ -1,11 +1,16 @@
+/** @typedef {typeof import("./types").VitePluginVanJS} VitePluginVanJS */
+/** @typedef {import("./types").VanJSPluginOptions} VanJSPluginOptions */
 /** @typedef {import("vite").ResolvedConfig} ResolvedConfig */
 /** @typedef {import("./types").PageFile} PageFile */
 /** @typedef {import("./types").RouteFile} RouteFile */
+/** @typedef {import("vite").BuildAppHook} BuildAppHook */
+/** @typedef {import("vite").TransformResult} TransformResult */
+/** @typedef {import("vite").Plugin} Plugin */
+/** @typedef {ThisParameterType<BuildAppHook>} PluginContext */
 
 import { fileURLToPath } from "node:url";
 import { dirname, join, resolve } from "node:path";
 import process from "node:process";
-import { transformWithEsbuild } from "vite";
 import { routes } from "../router/routes.mjs";
 import { generateRoute, getRoutes } from "./helpers.mjs";
 
@@ -49,6 +54,7 @@ const debugModuleAliases = {
   "@vanjs/setup": "../setup/index-debug",
 };
 
+/** @type {VitePluginVanJS} */
 export default function VitePluginVanJS(options = {}) {
   const pluginConfig = { ...pluginDefaults, ...options };
   const { routesDir } = pluginConfig;
@@ -57,6 +63,10 @@ export default function VitePluginVanJS(options = {}) {
   let config;
   /** @type {RouteFile[] | null} */
   let routeCache = null;
+  /** @type {PluginContext} */
+  let context;
+  let viteVersion = "8.0.0";
+  let isOxc = true;
 
   const virtualModuleId = "virtual:@vanjs/routes";
   const resolvedVirtualModuleId = "\0" + virtualModuleId;
@@ -64,6 +74,12 @@ export default function VitePluginVanJS(options = {}) {
   return {
     name: "vanjs",
     enforce: "pre",
+    buildStart() {
+      context = this;
+      viteVersion = context.meta?.viteVersion[0];
+      isOxc = Number(viteVersion) >= 8;
+    },
+    // @ts-expect-error - this is temporary esbuild will be
     config() {
       return {
         optimizeDeps: {
@@ -89,17 +105,29 @@ export default function VitePluginVanJS(options = {}) {
             "@vanjs/jsx": toAbsolute("../jsx"),
           },
         },
-        esbuild: {
-          jsx: "automatic",
-          jsxImportSource: "@vanjs/jsx",
-        },
+        ...(
+          isOxc
+            ? {
+              oxc: {
+                include: /\.(jsx?|tsx?)$/,
+                jsx: {
+                  runtime: "preserve", // Options: 'automatic', 'classic', 'preserve'
+                  importSource: "@vanjs/jsx", // Default import source
+                },
+              },
+            }
+            : {
+              esbuild: {
+                jsx: "automatic",
+                jsxImportSource: "@vanjs/jsx",
+              },
+            }
+        ),
       };
     },
-    /** @param {import("vite").ResolvedConfig} resolvedConfig */
     configResolved(resolvedConfig) {
       config = resolvedConfig;
     },
-    /** @param {import("vite").ViteDevServer} server */
     configureServer(server) {
       // Watch routes directory
       const pagesPath = join(config.root, routesDir);
@@ -129,7 +157,6 @@ export default function VitePluginVanJS(options = {}) {
       server.watcher.on("unlinkDir", changeHandler);
       server.watcher.on("change", changeHandler);
     },
-    /** @type {(source: string, importer: string | undefined, ops: { ssr: boolean }) => string | null} */
     resolveId(source, importer, { ssr }) {
       // Handle virtual module
       if (source === virtualModuleId) {
@@ -171,11 +198,12 @@ export default function VitePluginVanJS(options = {}) {
         aliases = { ...aliases, ...debugModuleAliases };
       }
       // Check if the source is a known module
+      /* istanbul ignore next @preserve */
       const matchedSource =
         isResolvedVanFile || (source === "vanjs-core" && !isSetupFile)
           ? "@vanjs/van"
           : isResolvedVanXFile ||
-              (source === "vanjs-ext" && /* istanbul ignore next */
+              (source === "vanjs-ext" &&
                 !isImportedVanXFile)
           ? "@vanjs/vanX"
           : isResolvedSetupFile && (!ssr && isSetupFile || ssr && !isSetupFile)
@@ -189,7 +217,6 @@ export default function VitePluginVanJS(options = {}) {
 
       return null;
     },
-    /** @type {(id: string, ops: { ssr: boolean }) => Promise<({ code: string, map: null } | null)>} */
     async load(id, ops) {
       // istanbul ignore else
       if (id === resolvedVirtualModuleId) {
@@ -212,21 +239,31 @@ routes.length = 0;
 // Register routes
 ${currentRoutes.map(generateRoute).join("\n")}
 ${
-          ops.ssr && currentRoutes.length
+          (ops && ops.ssr && currentRoutes.length)
             ? `console.log(\`🍦 @vanjs/router registered ${currentRoutes.length} routes.\`)`
-            : /* istanbul ignore next - satisfied */ ""
+            : /* istanbul ignore next @preserve */ ""
         }
 `;
 
-        const result = await transformWithEsbuild(
-          routesScript,
-          id,
-          { loader: "js" },
-        );
+        const vite = await import("vite");
+        const transformer = isOxc ? "transformWithOxc" : "transformWithEsbuild";
+        const langProp = isOxc ? "lang" : "loader";
+        // const mapProp = isOxc ? "source_map" : "sourcemap";
+
+        const result = await vite[transformer](routesScript, id, {
+          [langProp]: "js",
+          sourcemap: true,
+        });
 
         return {
           code: result.code,
-          map: null,
+          map: result.map
+            ? (
+              typeof result.map === "string"
+                ? JSON.parse(result.map)
+                : /* istanbul ignore next @preserve */ result.map
+            )
+            : /* istanbul ignore next @preserve */ null,
         };
       }
       return null;

package/plugin/types.d.ts

@@ -5,15 +5,15 @@ export * from "../router/types.d.ts";
 export * from "../meta/types.d.ts";
 export * from "../server/types.d.ts";
 export * from "../client/types.d.ts";
-import type { PluginOption } from "vite";
+import type { Plugin } from "vite";
 
 export type VanJSPluginOptions = {
-  routesDir: string;
-  extensions: string[];
+  routesDir?: string;
+  extensions?: string[];
 };
 
 export declare const VitePluginVanJS: (
   config?: VanJSPluginOptions,
-) => PluginOption<VanJSPluginOptions>;
+) => Plugin<VanJSPluginOptions>;
 
 export default VitePluginVanJS;

package/tsconfig.json

@@ -2,8 +2,6 @@
    // https://janessagarrow.com/blog/typescript-and-esbuild/
   "compilerOptions": {
     "lib": ["DOM", "ESNext", "DOM.Iterable"],
-    "rootDir": "./",
-    "baseUrl": "./",
     "module": "ESNext",
     "target": "ESNext",
     "moduleResolution": "Bundler",