Privacy Policy
Snippets index

  django-compressor setup

Author: morlandi@brainstorm.it
Creato: Domenica 03 Dicembre 2017 23:10
Tags: django, compressor

file "settings.py"

INSTALLED_APPS = [
    ...
    'compressor',
    ...
]

...

#
# django-compressor settings
#

STATICFILES_FINDERS.append('compressor.finders.CompressorFinder')

COMPRESS_PRECOMPILERS = (
    # ('text/coffeescript', 'coffee --compile --stdio'),
    # ('text/less', 'lessc {infile} {outfile}'),
    ('text/x-sass', 'sass {infile} {outfile}'),
    ('text/x-scss', 'sass --scss {infile} {outfile}'),
    #('text/stylus', 'stylus < {infile} > {outfile}'),
)

COMPRESS_CSS_FILTERS = [
    'compressor.filters.css_default.CssAbsoluteFilter',
    'compressor.filters.cssmin.CSSMinFilter',
]

COMPRESS_OFFLINE = True
COMPRESS_REBUILD_TIMEOUT = 2592000

file "local.py" (development settings)

COMPRESS_ENABLED = True    # test compressor effects; comment this to use uncompressed statics
COMPRESS_OFFLINE = False

file "base.html" or other templates:

{% load ... compress %}
<!DOCTYPE html>
<html lang="en">
    <head>
        ...

        {% compress css file %}
            <!-- Bootstrap -->
            <link href="{% static 'bootstrap/css/bootstrap.min.css' %}" rel="stylesheet">
            <link href="{% static 'bootstrap/css/bootstrap-theme.min.css' %}" rel="stylesheet">
            <!-- link href="{% static 'bootstrap_lightbox/ekko-lightbox.css' %}" rel="stylesheet" -->

            <link rel="stylesheet" href="{% static 'aecweb/css/aecweb.scss' %}" type="text/x-scss" charset="utf-8" />

        {% endcompress %}

        {# Additional CSS includes #}
        {% block extrastyle %}
            ...
        {% endblock %}

    </head>
    <body role="document" class="page-{% block body_class %}{% endblock body_class %}">

        ...
        ...

        {% compress js file %}
            <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
            <script src="{% static 'bootstrap/jquery-1.11.1.min.js' %}"></script>
            <script src="{% static 'bootstrap/jquery-ui-1.11.4.min.js' %}"></script>
            <!-- Include all compiled plugins (below), or include individual files as needed -->
            <script src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>

            <!-- script src="{% static 'bootstrap_lightbox/ekko-lightbox.min.js' %}"></script -->

            <script src="{% static 'aecweb/js/utils.js' %}"></script>
            <script src="{% static 'aecweb/js/sprintf.min.js' %}"></script>
        {% endcompress %}

        <script src="{% url 'js_reverse' %}" type="text/javascript"></script>

        {# Additional JS files in footer, right before </body> #}
        {% block extrajs %}
            ...
        {% endblock %}

    </body>
</html>

Install Django-compressor on Ubuntu:

sudo apt-get install python-dev
sudo apt-get install build-essential

pip install rcssmin --install-option="--without-c-extensions"
pip install rjsmin --install-option="--without-c-extensions"
pip install django-compressor --upgrade

Deployment:

- add "compress" to management commands