jrief / django-sass-processor

SASS processor to compile SCSS files into *.css, while rendering, or offline.
MIT License
402 stars 64 forks source link

urls are not correctly processed #116

Closed ewingrj closed 5 years ago

ewingrj commented 5 years ago

With the following directory structure:

screen shot 2019-02-19 at 1 31 34 pm

I have a rule in _bootstrap_startup_ui.scss like:

background: $background-color url(../images/cover-bg-1.jpg) center;

style.scss imports sass/_bootstrap_start_ui.scss

after compilation & collectstatic, I end up with a single css file in static/core/style.css however the background url is still url(../images/cover-bg-1.jpg). It would need to be url(images/cover-bg-1.jpg) to point to the correct location.

I'm not sure if this is a config issue or not?

Relevant settings.py:

STATIC_ROOT = os.getenv('DJANGO_STATIC_ROOT', os.path.join(BASE_DIR, 'static'))

STATIC_URL = '/static/'

STATICFILES_DIRS = [os.path.join(BASE_DIR, 'mysite', 'admin_ui', 'build', 'static')]

STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'

WHITENOISE_ROOT = os.path.join(BASE_DIR, 'mysite', 'admin_ui', 'build', 'root')

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

SASS_PROCESSOR_INCLUDE_DIRS = [
    os.path.join(BASE_DIR, 'node_modules'),
]
jrief commented 5 years ago

I'm not sure about the rules for relative includes in the sass-compiler, therefore after looking at your sample, it might be that you have to write url(../../images/cover-bg-1.jpg) since _bootstrap_startup_ui.scss is two levels up.

Anyway, I prefer to specify include paths explicitly. You may use your SASS_PROCESSOR_INCLUDE_DIRS and rewrite the above to url(core/images/cover-bg-1.jpg). Otherwise extend SASS_PROCESSOR_INCLUDE_DIRS; these values are passed into the compiler directly.

ewingrj commented 5 years ago

so changing it to url(images/cover-bg-1.jpg) worked I guess relative urls are taken from the static/app/ path. I didn't need to change SASS_PROCESSOR_INCLUDE_DIRS either.