Flask-Vite-Assets
A Flask extension that seamlessly integrates Vite asset management into your Flask/Jinja2 templates, supporting both the Vite dev server (with HMR) and production manifest-based asset fingerprinting.
Features
- 🔥 Hot Module Replacement (HMR) in development via the Vite dev server
- 📦 Manifest-based asset fingerprinting in production
- 🎨 Automatic CSS injection from the Vite manifest
- ⚡ Cache-busting
url_for— static file URLs automatically gain a?v=<mtime>parameter so browsers always pick up the latest file after a deployment - 🔌 Flask extension pattern with
init_appsupport - 🧩 Zero-config defaults with full configurability
- 🐍 Typed — ships with
py.typed
Installation
pip install flask-vite-assets
If you use the Vite dev server in development, also install requests:
pip install "flask-vite-assets[dev-server]"
Quick start
Application factory pattern
from flask import Flask
from flask_vite_assets import ViteAssets
vite = ViteAssets()
def create_app():
app = Flask(__name__)
vite.init_app(app)
return app
Direct initialisation
from flask import Flask
from flask_vite_assets import ViteAssets
app = Flask(__name__)
ViteAssets(app)
Jinja2 templates
<!DOCTYPE html>
<html>
<head>
<!-- Injects <link> + <script> tags from the Vite manifest in production,
or a <script> tag pointing at the Vite dev server in development -->
{{ vite_asset("js/main.js") }}
<!-- Cache-busting url_for: appends ?v=<mtime> to static file URLs so
browsers always fetch the latest file after a deployment -->
<link rel="stylesheet" href="{{ url_for('static', filename='css/extra.css') }}">
</head>
<body>
...
<!-- Injects the Vite HMR client in development only (no-op in production) -->
{{ vite_hmr_client() }}
</body>
</html>
How it works
Development mode (DEBUG=True)
- The extension attempts to connect to the Vite dev server (default
http://localhost:5173). - If the server is reachable it returns a
<script type="module">tag pointing at the dev server, enabling HMR. - If the primary port is unavailable it automatically tries the next port (
5174), which Vite uses when the preferred port is already occupied. - If neither server is reachable it falls back to the production manifest.
Production mode (DEBUG=False)
- Reads
<app.static_folder>/.vite/manifest.json. - For each entry emits
<link rel="stylesheet">tags for associated CSS files, then a<script type="module">tag for the JS bundle. - Falls back to serving the asset path directly if the manifest is missing or malformed.
Configuration
All configuration is optional.
| Flask config key | Environment variable | Default | Description |
|---|---|---|---|
VITE_DEV_SERVER |
VITE_DEV_SERVER |
http://localhost:5173 |
Base URL of the Vite dev server |
VITE_MANIFEST_PATH |
— | <app.static_folder>/.vite/manifest.json |
Absolute path to the production Vite manifest |
Flask config takes precedence over environment variables.
Vite configuration
Point Vite's output at your Flask static folder and enable manifest generation:
// vite.config.js
import { defineConfig } from "vite";
export default defineConfig({
root: "resources",
base: "/static/",
build: {
outDir: "../resources/static",
manifest: true,
rollupOptions: {
input: "assets/js/main.js",
},
},
});
Using the helpers directly
You can also call the helpers directly in Python code instead of going through the extension:
from flask_vite_assets import vite_asset, vite_hmr_client
License
MIT
1 maintainer
Release files for flask-vite-assets 0.2.0
For a detailed explanation of source distributions (sdists) and built distributions (wheels), please see the package formats documentation.
Source distribution (sdist)
| File | Size | Uploaded | |
|---|---|---|---|
| flask_vite_assets-0.2.0.tar.gz | 8.8 kB | Details |
Built distribution (wheel)
| File | Interpreter | ABI | Platform | Reset |
|---|---|---|---|---|
| flask_vite_assets-0.2.0-py3-none-any.whl | Python 3 | none | any | Details |
Total release size: 16.6 kB
Release files / flask_vite_assets-0.2.0.tar.gz
| Download URL | flask_vite_assets-0.2.0.tar.gz |
|---|---|
| Size | 8.8 kB |
| Tags | Source |
|
SHA-256 checksum How to use checksums |
aa9ed7923c9f25c0e7baaf5c7023e7250399ac7d7052246356e247264d3ae019
|
|
BLAKE2b-256 checksum How to use checksums |
9adefd7571f3147583bdd9b7e938229fcb85aaf46ad081c318e30e9d5c8e6fd4
|
| Upload date | |
|
Uploaded using Trusted Publishing? What is trusted publishing? |
Yes |
| Uploaded via |
twine/6.1.0 CPython/3.13.7
|
Provenance
Provenance describes where a file came from. On PyPI, provenance is shared via attestations, which provide a verifiable record of the build or publishing details. View details, limitations and caveats.
PyPI Publish Attestation
PyPI verified that this artifact, at this checksum, originated from the publisher listed below.
Signed by GitHub Actions, verified by PyPI on Feb 24, 2026.
Transparency logRelease files / flask_vite_assets-0.2.0-py3-none-any.whl
| Download URL | flask_vite_assets-0.2.0-py3-none-any.whl |
|---|---|
| Size | 7.7 kB |
| Tags | Python 3 |
|
SHA-256 checksum How to use checksums |
c508563a25c5974a44293af5089ebd9c9e700826d2cc7c4c8e0f65bda341439a
|
|
BLAKE2b-256 checksum How to use checksums |
72e6c1f5d0d36e0318364c609b81c5929f926092a5e5a06a0d4df01f5e8541b9
|
| Upload date | |
|
Uploaded using Trusted Publishing? What is trusted publishing? |
Yes |
| Uploaded via |
twine/6.1.0 CPython/3.13.7
|
Provenance
Provenance describes where a file came from. On PyPI, provenance is shared via attestations, which provide a verifiable record of the build or publishing details. View details, limitations and caveats.
PyPI Publish Attestation
PyPI verified that this artifact, at this checksum, originated from the publisher listed below.
Signed by GitHub Actions, verified by PyPI on Feb 24, 2026.
Transparency log
