CRS...
CRS...

Reputation: 95

Integrate SASS/SCSS with Django

I want to use SASS/SCSS with Django application.

I followed the link https://bitbucket.org/synic/django-sass. I installed SASS using sudo pip install sass.

When i run Python manage.py runserver,iam getting error as

'sass' is not a valid tag library: Template library sass not found, tried django.templatetags.sass

Can Anyone help me?!

Upvotes: 7

Views: 8908

Answers (4)

Al Mahdi
Al Mahdi

Reputation: 820

Here is my DIY out of the box solution

  1. Install Libsass and Watchdog

    pip install libsass watchdog
    
  2. Create an app named core

    python manage.py startapp core
    

core/sass.py

import os
import time
import site
import sass
import threading
from pathlib import Path
from django.apps import apps
from django.conf import settings
from watchdog.observers import Observer
from watchdog.events import FileClosedEvent


def compiler():
    packageFolders = [
        site.getusersitepackages(),
        *[path for path in site.getsitepackages()],
    ]

    staticFolders = settings.STATICFILES_DIRS.copy()
    staticFolders += [
        os.path.join(app.path, "static") for app in apps.get_app_configs()
    ]

    compileFolders = staticFolders.copy()
    for staticFolder in staticFolders:
        for packageFolder in packageFolders:
            if Path(staticFolder).is_relative_to(packageFolder):
                if staticFolder in compileFolders:
                    compileFolders.remove(staticFolder)

    if settings.DEBUG:

        def watcher(path):
            class Event(FileClosedEvent):
                def dispatch(self, event):
                    filename, extension = os.path.splitext(event.src_path)
                    if extension == ".scss":
                        time.sleep(0.5)
                        for d in compileFolders:
                            if os.path.isdir(d):
                                try:
                                    sass.compile(
                                        dirname=(d, d),
                                        output_style="expanded",
                                        include_paths=staticFolders,
                                    )
                                except sass.CompileError as error:
                                    print(error)

            event_handler = Event(path)
            observer = Observer()
            observer.schedule(event_handler, path, recursive=True)
            observer.start()
            try:
                while True:
                    time.sleep(1)
            except KeyboardInterrupt:
                observer.stop()
            observer.join()

        for d in compileFolders:
            if os.path.isdir(d):
                try:
                    sass.compile(
                        dirname=(d, d),
                        output_style="expanded",
                        include_paths=staticFolders,
                    )
                except sass.CompileError as error:
                    print(error)
                thread = threading.Thread(target=watcher, args=(d,), daemon=True)
                thread.start()
    else:
        d = settings.STATIC_ROOT
        if os.path.exists(d):
            try:
                sass.compile(
                    dirname=(d, d),
                    output_style="expanded",
                    include_paths=staticFolders,
                )
            except sass.CompileError as error:
                print(error)

core/apps.py

from django.apps import AppConfig
from core.sass import compiler


class CoreConfig(AppConfig):
    default_auto_field = 'django.db.models.BigAutoField'
    name = 'core'

    def ready(self):
        compiler()

For more info, djboilerplate is a boilerplate project where I have added this out of the sass feature

Upvotes: 0

Royalbishop101
Royalbishop101

Reputation: 187

The django-sass-processor package is a great package that lets you easily integrate SASS/SCSS with Django.

Here's a tutorial on how to set up SASS/SCSS with Django.

I've used the package a few times and have been happy with it.

Upvotes: 0

Glycerine
Glycerine

Reputation: 7347

Have you first installed sass, the ruby app?

$ apt-get install ruby-sass

You'll know if it's done properlly; as type sass on the command line, does sassy things.

Next, I cloned django-sass (from the other answer):

git clone git@bitbucket.org:synic/django-sass.git

Then navigated to the puled folder and installed it.

$ python setup.py install

Initially the installation crashed out:

IOError: [Errno 2] No such file or directory: 'CHANGES.rst'

So I quickly created the file:

 touch CHANGES.rst

and ran the install command again.

no problems.

Upvotes: 0

user3331198
user3331198

Reputation: 184

python sass (pip install sass) https://pypi.python.org/pypi/sass is different from django-sass (https://bitbucket.org/synic/django-sass)

Download django sass from https://bitbucket.org/synic/django-sass after that install and setup as documented .

Upvotes: 2

Related Questions