The static in a URL is being duplicated when serving with Vite to Django backend

I'm trying to integrate vite with django using django-vite package. (no SPA, just htmx, alpine and bulma). Everything works fine in both dev mode and production mode (debug on, vite serves static files, debug off, vite builds them, django serves them). The only problem is that in dev mode, the static part of the url for static assets is duplicated like this:

<script type="module" src="http://localhost:5173/static/static/js/main.js"></script>

It's not causing any actual problems, but still i am concerned.

Here's vite.config.js:

import { defineConfig } from 'vite';
import { resolve } from 'path';

export default defineConfig({
    base: "/static/",
    build: {
        emptyOutDir: false,
        manifest: "manifest.json",
        outDir: resolve(import.meta.dirname, "assets"), // -> MUST be included in STATICFILES_DIRS
        // assetsDir: "static", // the folder name inside outDir
        rolldownOptions: {
            input: {
                main: resolve(import.meta.dirname, "static/js/main.js"),
                style: resolve(import.meta.dirname, "static/css/style.css"),
            },
            output: {
                entryFileNames: `js/[name]-bundle.js`,
                assetFileNames: `css/[name]-bundle.css`,
            }
        },
    },
});

Django related settings:

STATIC_URL = 'static/'

# must equal to vite's build.outDir
STATICFILES_DIRS = [
    BASE_DIR / "static"
]

DJANGO_VITE = {
  "default": {
    "dev_mode": True,
    "manifest_path": BASE_DIR / "assets" / "manifest.json",
  }
}

Вернуться на верх