baseline
manual

Vite ​

Frontend assets are bundled using Vite.

Backend Integration ​

External Docs:

baseline integrates Vite using middleware mode and appType "custom". By attaching Vite as middleware to the Express backend, the framework maintains a single, unified server.

This ensures that all requests - whether for API routes or frontend assets - are handled by one consistent process, simplifying the development environment.

To provide fast builds and high-performance Hot Module Replacement (HMR), Vite serves assets from memory during development rather than writing them to disk. While this requires handling different request paths between development and production environments, the performance benefits of in-memory serving justify the added complexity.

Deep Dive: The trade-off of in-memory serving

While a "write to disk" workflow is more traditional and offers simpler backend integration, Vite's in-memory serving provides a significant performance advantage during development. The decision to adopt this approach involves managing the complexity inherent in the middleware pattern, a topic explored in my blog post.

vite-express comes with a custom internal logic which always tries to find the index.html, no matter how deeply nested the url path is.

"Viteless Mode" ​

baseline utilizes vite-express in "viteless mode". Vite is not a production dependency. In production, the webserver is configured with the necessary base paths and asset locations to serve pre-built files directly from var/dist/.

Design Rationale: Vite vs. Webpack ​

Philosophy: Frictionless Development

While Webpack has been a standard for many years, baseline uses Vite to prioritize a modern Developer Experience (DX).

While Webpack's "write to disk" approach simplifies backend integration, Vite's performance model and maintenance ease make it a superior fit for the fast-paced development workflows required by this framework.