Assets and Vite
Understand automatic entry discovery, Vite development and production asset loading, and template asset tags.
This page focuses on the practical details. Use the quick links below to move to the previous, next, or related docs.
HyperDjango is built around automatic asset discovery.
Pages, layouts, and template packages can load nearby Vite entries without hand-wiring script tags for every feature.
Core Settings
HYPER_FRONTEND_DIR = BASE_DIR / "hyper"
HYPER_VITE_OUTPUT_DIR = BASE_DIR / "dist"
HYPER_VITE_DEV_SERVER_URL = "http://localhost:5173/"
HYPER_DEV = DEBUG
TEMPLATES[0]["DIRS"].append(HYPER_FRONTEND_DIR)
STATICFILES_DIRS = [HYPER_VITE_OUTPUT_DIR]
HYPER_FRONTEND_DIR
Where HyperDjango finds your hyper/ tree.
HYPER_VITE_OUTPUT_DIR
Where Vite writes built assets. In production, HyperDjango reads the manifest here.
HYPER_VITE_DEV_SERVER_URL
Which Vite dev server URL should be injected during development.
HYPER_DEV
Whether to use dev-server assets or manifest-based production assets.
Automatic Entry Discovery
HyperDjango looks for nearby files such as:
entry.tsentry.jsentry.head.tsentry.head.js- custom entries like
admin.entry.ts
This works for:
- routed pages
- layout packages
- standalone template packages
What Gets Loaded
entry.ts/entry.js: body module scriptsentry.head.ts/entry.head.js: head module scripts- CSS imported by those entries
- Vite module preloads
Development vs Production
In development:
- HyperDjango injects the Vite dev server URL
- Vite client is added automatically where needed
python manage.py hyper_runserverstarts both servers and assigns Vite a free port- Vite readiness is confirmed before Django starts, with startup failures surfaced inline
In production:
- HyperDjango resolves built assets from
dist/.vite/manifest.json - Django system checks report missing or stale manifests before serving traffic
Template Tags
Load the tags:
{% load hyper_tags %}
Available tags:
{% hyper_preloads %}{% hyper_stylesheets %}{% hyper_head_scripts %}{% hyper_body_scripts %}{% hyper_custom_entry "admin" %}
These tags read asset information from the current page object in template context.
Alpine Integration
Learn how HyperDjango integrates with Alpine through $action, local signal patches, and the global $store.hyper bridge.
Request Inspector
Enable and use HyperDjango's standalone request inspector for routes, actions, output, SSE streams, timings, SQL, and browser outcomes.