A mini meta-framework for VanJS powered by Vite
npm install vite-plugin-vanjs








A mini meta-framework for VanJS developed around the awesome vite and tested with vitest. 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;
@vanjs/setup* - enables loading VanJS modules isomorphically;
@vanjs/server* - provides various tools for Server Side Rendering (SSR);
@vanjs/client* - provides various tools for Client Side Rendering (CSR).
bash
npm install vite-plugin-vanjs@latest
``bash
pnpm add vite-plugin-vanjs@latest
``bash
deno add npm:vite-plugin-vanjs@latest
``bash
bun add vite-plugin-vanjs@latest
`
$3
For a complete guide on how to use the plugin, be sure to check the wiki:
* Quick Start: the right place to get started;
* Routing: a complete guide on how to configure routing;
* Metadata: the quick guide to help you manage your app meta tags;
* JSX: a complete guide on how to use JSX transformation;
* Isomorphic: a quick guide on isomorphism in VanJS;
* Hydration: a quick note on how the plugin handles hydration;
* About: some note on the project.
$3
* The plugin will automatically load the appropriate Van or VanX objects depending on the client/server environment with zero configuration needed. It uses the mini-van-plate/shared module to register the required mini-van-plate/van-plate on the server.
* Also in _development_ mode, the plugin will load the van.debug.js module to help you better troubleshoot your VanJS application. However JSX transformation is not compatible with the van.debug.js module.
* The plugin uses van-ext along with mini-van-plate so you can have everything ready from the start.
* Kickstart your VanJS project with npm create vanjs@latest`. Some starter templates feature this plugin and most essential tools.