Skip to main content

Integrates Vite resources into a Django web site.

Project description

DjVite

logo

Integrates Vite resources into a Django web site.

Web requests are first served through vite dev server, then either proxified to django dev server or served directly.

This simulates a nginx proxy and wsgi server.

How to use

  • Add djvite to your INSTALLED_APPS django config.
  • Define your static directories:
STATIC_URL = "static/"
STATIC_ROOT = BASE_DIR / 'static'
STATICFILES_DIRS = ['dist']
  • Load the djvite plugin into your templates:
<html>{% load djvite %}
...
</html>
  • Inject any script or link from vite into your template:
    • {% vite hotreload %} enables vite hot module reload in dev mode
    • {% vite '/src/main.js' %}
    • {% vite '/src/style.css' %}
  • Add DjVitePlugin to your vite.config.js file:
import { defineConfig } from 'vite'
import DjVitePlugin from 'djvite'
export default defineConfig({
  plugins: [DjVitePlugin({verbose: true})],
})

Notes:

You can add any attributes to the vite tag and it will be added to the final tags.

You can specifiy multiple sources within one vite tag, separate them with spaces.

You can use the get_nginx_config command to generate a working nginx static configuration.

Configuration

In django settings:

  • DJVITE dict, with the following keys:
    • DEV_MODE (boolean, default True) When False, resources are resolved using the vite-manifest.json file that list bundle files. This file is generated using vite build.
    • MODULE_EXTS (extension list, default ot ['.js']) Use this to provide other extensions to be served as module, for instance ['.js', '.ts', '.jsx', '.tsx'] in Typescript React application.
    • VITE_MANIFEST_PATH (Path | str, default to vite.manifest.json) Location to search for the Vite manifest. Used when DEV_MODE is False.

In vite config plugin:

  • options object for DjVitePlugin.
    • verbose default to false.
    • djangoPort default to DJANGO_PORT environment variable or 8000 if not defined.
    • djangoTemplatesGlob default to the globbing pattern **/templates.
    • manifestPath default to vite.manifest.json.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

djvite-1.4.2.tar.gz (10.8 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

djvite-1.4.2-py3-none-any.whl (8.3 kB view details)

Uploaded Python 3

File details

Details for the file djvite-1.4.2.tar.gz.

File metadata

  • Download URL: djvite-1.4.2.tar.gz
  • Upload date:
  • Size: 10.8 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: uv/0.7.22

File hashes

Hashes for djvite-1.4.2.tar.gz
Algorithm Hash digest
SHA256 9238e6ea306ecbdbb13f36222c87c78bfd4aae3685441ee0ffa019e0960ef3bc
MD5 bf0a6d1841b7327920acc95a97b5f52e
BLAKE2b-256 20fb9b87a38f69719b305b4f0228ff7925d76270fd093900a11fdb636ab63641

See more details on using hashes here.

File details

Details for the file djvite-1.4.2-py3-none-any.whl.

File metadata

  • Download URL: djvite-1.4.2-py3-none-any.whl
  • Upload date:
  • Size: 8.3 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: uv/0.7.22

File hashes

Hashes for djvite-1.4.2-py3-none-any.whl
Algorithm Hash digest
SHA256 2b207dc8c67bf77439bcafb50e07843a66d9b08055d0ca872ff8072feacb2759
MD5 55fcc73188bfdcdfd9b420c3da4745a6
BLAKE2b-256 c788342c6414e5b905f91c02255bfc9baeb1c4692ec6fc90ec7dea996566a6ab

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page