Serving static files from root directory in Django

Question

I have app level static files and want to serve global static files such as JQuery, my project structure is like this:

mysite
├───dashboard
│   ├───migrations
│   ├───static
│   │   └───dashboard
│   │       ├───css
│   │       ├───img
│   │       └───js
│   └───templates
│       └───dashboard
├───etc
├───static
│   └───js
|       └───jquery.min.js
└───mysite

I added the followed the django docs so that the settings.py looks

STATIC_ROOT = ""

STATIC_URL = '/static/'

STATICFILES_DIR = [
    os.path.join(BASE_DIR, "static"),
    os.path.join("static"),
]

STATICFILES_FINDERS = [
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
]

my urls.py looks like this

urlpatterns = [
    path('admin/', admin.site.urls),
    path("", include(dashboard.urls)),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

my INSTALLED_APPS looks like this

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    "dashboard",
]

when I try to access it from a template, it returns a response code 404 in the runserver log,

[09/Apr/2020 01:59:34] "GET /static/js/jquery.min.js HTTP/1.1" 404 1674

the template tag is like this

{% load static %}
<script src="{% static 'js/jquery.min.js' %}"></script>

This is my first Django project without following a tutorial, and any help would be appreciated. Thank You

EDIT: I was able to solve the problem by removing the STATIC_ROOT setting

Answer 1

You need to specify a prefix in front of one of the two directories named static because Django will use the first static file it finds whose name matches, and if you had a static file with the same name in a different application, Django would be unable to distinguish between them. We need to be able to point Django at the right one, and the best way to ensure this is by namespacing them. That is, by putting those static files inside another directory named for the application itself.

You can namespace static assets in STATICFILES_DIRS by specifying prefixes . For example:

STATICFILES_DIR = [
    ("main", os.path.join(BASE_DIR, "static")),
    os.path.join("static"),
]

and then:

<script src="{% static 'main/js/jquery.min.js' %}"></script>