Registry / web-framework / vite-plugin-vanjs

vite-plugin-vanjs

library0.1.18jsnpmunverified

vite-plugin-vanjs (v0.1.18) is a meta-framework for VanJS built on Vite, providing routing, JSX support, SSR/SSG, and isomorphic modules. Released with weekly updates, it integrates router, meta management, JSX transformation, and server/client helpers. Key differentiators: zero-config hydration, lazy route loading with async unification since v0.1.17, and automatic van.debug.js in dev mode. Requires node >=20, pnpm >=8.6.0, and peer deps csstype, mini-van-plate, vanjs-core, vanjs-ext.

web-framework

npm install vite-plugin-vanjs

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-VANJS

vite-plugin-vanjs

web-frameworkjavascriptv0.1.18

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

vitePluginVanjs

✓ import { vitePluginVanjs } from 'vite-plugin-vanjs'

✗ const vitePluginVanjs = require('vite-plugin-vanjs')

ESM-only package; requires Vite config ESM.

router

✓ import { router } from 'vite-plugin-vanjs/router'

✗ import { router } from 'vite-plugin-vanjs'

Router is a separate subpath export; default export is the plugin.

lazy

✓ import { lazy } from 'vite-plugin-vanjs/router'

✗ const lazy = require('vite-plugin-vanjs/router').lazy

Since v0.1.17, lazy() is async on both server and client.

Basic setup: Vite config with the plugin, then use the router with lazy-loaded routes.

// vite.config.js import { defineConfig } from 'vite'; import { vitePluginVanjs } from 'vite-plugin-vanjs'; export default defineConfig({ plugins: [vitePluginVanjs()] }); // pages/index.js import { lazy, router } from 'vite-plugin-vanjs/router'; import van from 'vanjs-core'; const Home = () => van.tags.div('Hello from VanJS!'); const routes = { '/': Home, '/about': lazy(() => import('./pages/About')) }; const app = document.getElementById('app'); router(app, routes);

Debug

Known issues

breakinglazy() changed to async on both server and client in v0.1.17

fix

Update lazy() calls to handle async functions; previously client returned synchronous van.state.

affects: >=0.1.17

breakingexecuteLifecycle() signature changed in v0.1.17

fix

Change executeLifecycle(route, params) to match new signature (route, params).

affects: >=0.1.17

deprecatedScript and Style removed from Meta module in v0.1.15

fix

Use separate import for Script and Style from @vanjs/meta or handle manually.

affects: >=0.1.15

gotchaJSX transformation incompatible with van.debug.js in dev mode

fix

Disable van.debug.js or avoid JSX in development; plugin auto-loads van.debug.js in dev mode.

affects: >=0.1.0

gotcharequires node >=20 and pnpm >=8.6.0

fix

Check Node.js version with `node --version` and pnpm with `pnpm --version`; upgrade if needed.

affects: >=0.1.0

Errors

Common errors & fixes

Cannot find module 'vite-plugin-vanjs/router'

Missing subpath export or incorrect import path.

fix

Ensure you use import { router } from 'vite-plugin-vanjs/router' (no default export).

lazy is not a function

Using older version (<0.1.17) or incorrect import.

fix

Update to v0.1.17+ and import { lazy } from 'vite-plugin-vanjs/router'.

Uncaught TypeError: van.tags is undefined

vanjs-core not installed or not imported.

fix

Install vanjs-core and import van before using tags.

Upgrade

Version history

0.1.18latest on npm

Audit

Dependencies

csstypeoptionalTypeScript types for CSS

mini-van-platerequiredServer-side VanJS rendering

vanjs-corerequiredCore VanJS library

vanjs-extrequiredVanJS extensions

Agent activity

5 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/thednp/vite-plugin-vanjs ↗

packagehttps://www.npmjs.com/package/vite-plugin-vanjs ↗