@cfdez11/vex

A vanilla JavaScript meta-framework built on Express.js with file-based routing, multiple rendering strategies (SSR, CSR, SSG, ISR), streaming Suspense, and a Vue-like reactive system — no TypeScript, no bundler.

Requires Node.js >= 18.

Installation

npm install @cfdez11/vex

Quick Start

mkdir my-app && cd my-app
npm init -y
npm install @cfdez11/vex
npm install -D tailwindcss npm-run-all

Update package.json:

{
  "type": "module",
  "scripts": {
    "dev":     "run-p dev:*",
    "dev:app": "vex dev",
    "dev:css": "npx @tailwindcss/cli -i ./src/input.css -o ./public/styles.css --watch",
    "build":   "vex build",
    "start":   "vex start"
  }
}

Create the minimum structure:

mkdir -p pages src public
echo '@import "tailwindcss";' > src/input.css
npm run dev
# → http://localhost:3001

Documentation

• Routing & Project Structure
• Components & Layouts
• Rendering Strategies
• Reactive System
• Template Syntax
• Configuration & API
• Deploy to Vercel

Roadmap

• [x] File-based routing with dynamic segments
• [x] SSR / CSR / SSG / ISR rendering strategies
• [x] Incremental Static Regeneration with background revalidation
• [x] Static path pre-generation (getStaticPaths)
• [x] Auto-generated server and client route registries
• [x] Streaming Suspense with fallback UI
• [x] Vue-like reactive system (reactive, computed, effect, watch)
• [x] Nested layouts per route
• [x] SPA client-side navigation
• [x] Prefetching with IntersectionObserver
• [x] Server-side data caching (withCache)
• [x] HMR (hot reload) in development
• [x] Component props (xprops)
• [x] vex/ import prefix for framework utilities
• [x] vex.config.json — configurable srcDir and watchIgnore
• [x] Published to npm as @cfdez11/vex
• [x] VS Code extension with syntax highlighting and go-to-definition
• [ ] Refactor client component prop pipeline
• [ ] esbuild minification for production builds
• [ ] esbuild source maps in dev mode
• [ ] esbuild browser target config
• [ ] esbuild code splitting for shared dependencies
• [ ] Devtools
• [ ] TypeScript support (framework + user code)
• [ ] Improved VS Code extension
• [ ] Theme syntax
• [ ] Docs page
• [ ] Authentication middleware
• [ ] CDN cache integration
• [ ] Fix Suspense marker replacement with multi-root templates
• [ ] Refactor template engine — replace htmlparser2 + dom-serializer parse/transform/serialize pipeline with a build-time template compiler (à la Vue/Svelte) that generates render functions. Current limitations: htmlparser2 decodes HTML entities on parse and dom-serializer doesn't re-encode them correctly (< inside <pre> becomes literal <); whitespace inside <pre>/<code> is incorrectly stripped; workarounds patched but root cause is architectural. Build-time compilation would eliminate all these issues and improve runtime performance.