Issue with static files when deploying Django app to Heroku

Question

My project folder looks this:

├── Procfile
├── core
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-39.pyc
│   │   └── views.cpython-39.pyc
│   ├── admin.py
│   ├── apps.py
│   ├── migrations
│   │   └── __init__.py
│   ├── models.py
│   ├── tests.py
│   └── views.py
├── db.sqlite3
├── inspirationSources.txt
├── manage.py
├── package-lock.json
├── package.json
├── react-frontend
│   ├── README.md
│   ├── build
│   │   ├── asset-manifest.json
│   │   ├── favicon.ico
│   │   ├── index.html
│   │   ├── logo192.png
│   │   ├── logo512.png
│   │   ├── manifest.json
│   │   ├── robots.txt
│   │   └── static
│   ├── package-lock.json
│   ├── package.json
│   ├── public
│   │   ├── favicon.ico
│   │   ├── index.html
│   │   ├── logo192.png
│   │   ├── logo512.png
│   │   ├── manifest.json
│   │   └── robots.txt
│   └── src
│       ├── App.css
│       ├── App.js
│       ├── App.test.js
│       ├── assets
│       ├── components
│       ├── hooks
│       ├── index.css
│       └── index.js
├── requirements.txt
├── spotify
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-39.pyc
│   │   ├── admin.cpython-39.pyc
│   │   ├── apps.cpython-39.pyc
│   │   ├── cluster.cpython-39.pyc
│   │   ├── credentials.cpython-39.pyc
│   │   ├── models.cpython-39.pyc
│   │   ├── urls.cpython-39.pyc
│   │   ├── util.cpython-39.pyc
│   │   └── views.cpython-39.pyc
│   ├── admin.py
│   ├── apps.py
│   ├── cluster.py
│   ├── credentials.py
│   ├── migrations
│   │   ├── 0001_initial.py
│   │   ├── __init__.py
│   │   └── __pycache__
│   ├── models.py
│   ├── templates
│   ├── tests.py
│   ├── urls.py
│   ├── util.py
│   └── views.py
├── spotifycluster
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-39.pyc
│   │   ├── settings.cpython-39.pyc
│   │   ├── urls.cpython-39.pyc
│   │   └── wsgi.cpython-39.pyc
│   ├── asgi.py
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
└── tutorialSources.txt

When I deploy with git push heroku main it seems to be fine but when I open the app in browser using the complementary url, I get the following errors on screen (debug mode is on):

TemplateDoesNotExist at /
build/index.html
Request Method: GET
Request URL:    https://nameless-taiga-02413.herokuapp.com/
Django Version: 3.1.7
Exception Type: TemplateDoesNotExist
Exception Value:    
build/index.html
Exception Location: /app/.heroku/python/lib/python3.9/site-packages/django/template/loader.py, line 19, in get_template
Python Executable:  /app/.heroku/python/bin/python
Python Version: 3.9.4
Python Path:    
['/app/.heroku/python/bin',
 '/app',
 '/app/.heroku/python/lib/python39.zip',
 '/app/.heroku/python/lib/python3.9',
 '/app/.heroku/python/lib/python3.9/lib-dynload',
 '/app/.heroku/python/lib/python3.9/site-packages']
Server time:    Fri, 30 Apr 2021 10:08:26 +0000
Template-loader postmortem
Django tried loading these templates, in this order:

Using engine django:

django.template.loaders.filesystem.Loader: /app/react-frontend/build/index.html (Source does not exist)
django.template.loaders.app_directories.Loader: /app/.heroku/python/lib/python3.9/site-packages/django/contrib/admin/templates/build/index.html (Source does not exist)
django.template.loaders.app_directories.Loader: /app/.heroku/python/lib/python3.9/site-packages/django/contrib/auth/templates/build/index.html (Source does not exist)

I have the following settings in my settings.py

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

Also I have whitenoise in my middleware list

MIDDLEWARE = [
    'whitenoise.middleware.WhiteNoiseMiddleware',
    ...]

The templates section in settings.py looks as follows

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'react-frontend')],
        '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',
            ],
        },
    },
]

I expected that Heroku would be able to find the static folder based on the STATIC_DIRS variable but that doesn't seem to be the case. Any clue what's going on here?

DSteman · Accepted Answer · 2021-04-30 14:19:54Z

1

So actually it was a really stupid mistake. react-frontend was a broken submodule and I needed to fix that by making sure .git/config didn't have submodules and removing react-frontend from the cache (No submodule mapping found in .gitmodules for path and missing .gitmodules file). Commit and pushed again and it worked...

answered Apr 30, 2021 at 14:19

DSteman

1,7145 gold badges15 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ankit Tiwari · Accepted Answer · 2022-08-22 11:54:52Z

0

if your DEBUG is set to False Django din't handle STATIC FILES. Heroku provide some configuration to serve STATIC FILES

STEP-1 : install whitenoise

$ pip install whitenoise

STEP-2 : check in settings.py whitenoise middleware by default it available in MIDDLEWARE if it's not that add it.

MIDDLEWARE = (
    'whitenoise.middleware.WhiteNoiseMiddleware',
    ...)

STEP-3: add this in your settings.py

STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'

edited Aug 22, 2022 at 11:54

answered Apr 30, 2021 at 10:28

Ankit Tiwari

4,7654 gold badges21 silver badges49 bronze badges

12 Comments

DSteman Over a year ago

I have whitenoise.middleware.WhiteNoiseMiddleware in MIDDLEWARE = [] along with my other middleware. Does it matter if I use MIDDLEWARE or MIDDLEWARE_CLASSES?

Ankit Tiwari Over a year ago

my bad MIDDLEWARE_CLASSES used in older version of Django check i edited my answer.

Ankit Tiwari Over a year ago

for wsgi configuration you can check official Doc. whitenoise.evans.io/en/legacy-2.x/django.html#enable-whitenoise

DSteman Over a year ago

"Your WhiteNoise configuration is incompatible with WhiteNoise v4.0" more info is on whitenoise.evans.io/en/stable/changelog.html#v4-0 It suggests that I should not manipulate wsgi.py like you suggest

Ankit Tiwari Over a year ago

Let us continue this discussion in chat.

|

Collectives™ on Stack Overflow

Issue with static files when deploying Django app to Heroku

2 Answers 2

Comments

12 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

12 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related