djangodeploymentnuxt.jsintegrate

Integrating Nuxt Js in Django "GET /_nuxt/bed9682.js HTTP/1.1" 404 2918


I am trying to integrate my Nuxt application inside Django. I have my Nuxt application and django application inside the same folder. I have set up the settings.py

    TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(BASE_DIR,'(Name of the nuxt application folder)/dist')
        ],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

And urls.py

from django.contrib import admin
from django.urls import path, include
from django.views.generic import TemplateView

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
   path('admin/', admin.site.urls),   #'admin-dashboard/'
   path('',TemplateView.as_view(template_name='index.html')) 
]

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

But It's failling to load this files in index.html

GET http://localhost:8000/_nuxt/3433182.js net::ERR_ABORTED 404 (Not Found)
GET http://localhost:8000/_nuxt/369ee37.js net::ERR_ABORTED 404 (Not Found)
GET http://localhost:8000/_nuxt/aad44e2.js net::ERR_ABORTED 404 (Not Found)
GET http://localhost:8000/_nuxt/bed9682.js net::ERR_ABORTED 404 (Not Found)
GET http://localhost:8000/_nuxt/img/page-background.74b6577.png 404 (Not Found)

Solution

  • any xxxx.js is static file, not the view-route. Django serve static files through settings: "static" or "media". you can setup in settings:

    # override Media
    MEDIA_URL = '/_nuxt/'
    MEDIA_ROOT = BASE_DIR / '_nuxt'
    

    or you can set up static folder with properly configured static:

    STATIC_ROOT = BASE_DIR / 'static'
    # add additional folder in static dirs
    STATICFILES_DIRS = ['core/statc', '/_nuxt/']
    

    of course if "_nuxt" exists in root of your project

    We use the NuxtJs too, in our project it works through static.