What it Does
express auto fontend library
Auto-detects your frontend framework or static files.
Dev mode:
Runs your frontend dev server automatically.
Proxies API calls (/api/*) to Express.
Proxies frontend requests (/*) to the frontend server.
Hot reload works out of the box.
Production mode:
Serves the static frontend build automatically.
Supports SPA routing (index.html fallback).
/api/* still goes to Express.
Installation
npm install express-auto-frontend
Usage Example
const express = require('express');
const include = require('express-auto-frontend');
const app = express();
const PORT = 3001;
// API route
app.get('/api/message', (req, res) => {
res.json({ message: 'Hello from backend!' });
});
// Include frontend automatically
include(app, '../frontend'); // path to your frontend folder
app.listen(PORT, () => console.log(Server running on http://localhost:${PORT}));
✅ In dev, you get unified URL + automatic proxying.
✅ In prod, Express serves the built frontend with SPA support.
Optional Config
include(app, '../frontend', {
backendPort: 3001, // required for proxying
devPort: 8080, // frontend dev port override
buildDir: 'build', // frontend build folder
devScript: 'start' // npm script for dev
});
Supported Frontends
React (Vite, CRA)
Vue (CLI, Nuxt)
Angular
Svelte / SvelteKit
Static HTML / Pug
Why Use It
No CORS headaches.
Single server URL for dev & prod.
Zero-config proxy setup.
Works across all major frontend frameworks.
