Unable to locate file while rendering tag 'sass_src' in template

Viewed 713

trying to integrate sass into my django3.1 project. I have tried implementing sass with other methods such as Django-compressor, but couldn't get it to work there either. So any suggestions to get the end goal of sass working would be appreciated.

following the steps on https://terencelucasyap.com/using-sass-django/ I tried implementing Django-sass-processor, but when I go to the home page it gives me the error Unable to locate file style.scss while rendering tag 'sass_src' in template app/index.html

Settings.py

INSTALLED_APPS = [
    ...
    #SASS
    'sass_processor',
]
...
STATICFILES_FINDERS = [
    'django.contrib.staticfiles.finders.FileSystemFinder',
    'django.contrib.staticfiles.finders.AppDirectoriesFinder',
    'sass_processor.finders.CssFinder',
]
STATIC_ROOT = os.path.join(BASE_DIR, "static")
STATIC_URL = '/static/'

#DJANGO SASS
SASS_PROCESSOR_ROOT = STATIC_ROOT

base.html

    {% load sass_tags %}
    {% load static %}
    ...
    <link href="{% sass_src 'style.scss' %}" rel="stylesheet" type="text/css" />

the site seems to work normally on the admin page. I ran collectstatic and the admin CSS is in the same folder as the style.scss so I don't think its an issue with STATIC_ROOT but I am not sure where the error is occurring.

tree

../ROOT/
├── db.sqlite3
├── manage.py
├── README.md
├── requirements.txt
├── static
│   ├── admin
│   └── style.scss
├── PROJECT
│   ├── asgi.py
│   ├── __init__.py
│   ├── __pycache__
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
└── APP
    ├── admin.py
    ├── apps.py
    ├── forms.py
    ├── __init__.py
    ├── migrations
    ├── models.py
    ├── __pycache__
    ├── templates
    │   └── APP
    │       ├── base.html
    │       ├── cityFrom.html
    │       └── index.html
    ├── tests.py
    ├── urls.py
    └── views.py

What am I missing to cause Django to be unable to find the file? Thanks for any and all advice!

1 Answers

I faced the same issue and in my case I had to configure the STATICFILES_DIRS setting like:

STATICFILES_DIRS = [ BASE_DIR / 'static' ]

NOTE STATIC_ROOT config is not needed in this case

django-sass-processor finds the files using finders. see here:

https://github.com/jrief/django-sass-processor/blob/master/sass_processor/storage.py#L26

The module's documentation (as you mentioned) suggests to configure them like this:

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

and without STATICFILES_DIRS the FileSystemFinder doesn't find anything.

Probably the issue is django 3.x related.. or maybe some finder is missing in the list above?

Related