CSS and images static files are loading however js are not

Question

urls.py:

from django.conf.urls import url, patterns
from registration import views
from django.conf import settings
from django.conf.urls.static import static
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from registration.views import index

urlpatterns = patterns('',
    # ex: /polls/,
     url(r'^index/', index.as_view(), name = 'index'),

)+ static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

urlpatterns += staticfiles_urlpatterns()

local.py

STATICFILES_FINDERS = (
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)

PROJECT_DIR  = os.path.dirname(__file__) 

MEDIA_ROOT = os.path.join(PROJECT_DIR, 'media')

MEDIA_URL = '/media/'

STATIC_ROOT = os.path.join(PROJECT_DIR, 'static')

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(PROJECT_DIR, 'staticfiles'),
)

index.html

<script src="{% static 'app_name/js/highcharts.js' %}"></script>
<script src="{% static 'app_name/js/highcharts-3d.js' %}"></script>
<script src="{% static 'app_name/js/exporting.js' %}"></script>

I am loading my css and images in the same manner as the above js files stated above. The images and CSS load perfectly fine. Any ideas why this is happening and how I can resolve it?

Thanks in advance!

Answer 1

The STATIC_ROOT setting is not used in development mode. It's only used when collecting static files with the 'collectstatic' management command. By default, static files are looked for in every installed app's subdirectory with the name 'static' and additionally any directory mentioned in the STATICFILES_DIRS setting.

Also, if you have DEBUG=True somewhere in your settings, you don't need to specifically add staticfiles_urlpatterns to your urls.py file. It's done automatically.

Assuming the following:

• your goal is to look for static files in a default django 'project' and so you don't have a separate django 'app' in your INSTALLED_APPS setting.
• your indexview can find your index.html template, you didn't post
• your view your project directory structure looks like this:

folder structure:

myproject
-manage.py
-myproject
-myproject>__init__.py
-myproject>urls.py
-myproject>settings.py
-myproject>wsgi.py
-staticfiles
-staticfiles>js>highcharts.js

Then, try this:

in settings.py (showing only relevant settings)

DEBUG=True
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'staticfiles'),
)
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'

In urls.py :

from django.conf.urls import url

urlpatterns = patterns('',
    url(r'^index/', index.as_view(), name = 'index'),
)

and in index.html :

{% load staticfiles %}
<script src="{% static 'js/highcharts.js' %}"></script>

Answer 2

The issue was some syntactical error in the javascript files. Resolved. Thanks everyone for your help.