CodeRaising / coderaising

The main website for CodeRaising.org
9 stars 5 forks source link

Add django-compressor to compress CSS and JS assets #1

Open natea opened 11 years ago

natea commented 11 years ago

i think it's just a matter of adding django-compressor to the requirements.txt file, and Mezzanine will auto-detect that it's in the Python path, but there might be some other config stuff that has to go in the settings.py file.

briandant commented 11 years ago

django-compressor relies on a {% compress %} tag, so it looks like we'll have to sift through the templates in our theme and update them with this tag.

natea commented 11 years ago

Mezzanine already uses the {% compress %} tag. In base.html, I see {% compress css %} and {% compress js %}

On Fri, Feb 8, 2013 at 6:56 PM, Brian Dant notifications@github.com wrote:

django-compressor relies on a {% compress %} tag, so it looks like we'll have to sift through the templates in our theme and update them with this.

— Reply to this email directly or view it on GitHubhttps://github.com/CodeRaising/coderaising/issues/1#issuecomment-13321529..

nate@appsembler.com +1 (617) 517-4953 http://twitter.com/natea | http://linkedin.com/in/natea

natea commented 11 years ago

It looks like these are the changes you need to make in order to enable django-compressor: https://github.com/rosarior/mayan/commit/6c7bc820a63ad49a25569a877a494710d4b6eff2

natea commented 11 years ago

More info about configuring django-compressor settings: https://github.com/BrianHicks/funding/blob/master/funding/settings/prod.py#L109

briandant commented 11 years ago

Assuming this is all set. Waiting for deployment before closing it.

briandant commented 11 years ago

Notes on making this work:

I left DEBUG=False to see how Compressor would respond as if it were in production.

1. Compressor will yell at you if you use a CDN within a {% compress %} tag, b/c all the assets need to be served at the COMRESS_URL:

UncompressableFileError: '//netdna.bootstrapcdn.com/bootswatch/2.1.1/united/bootstrap.min.css' isn't accesible via COMPRESS_URL ('/static/') and can't be compressed

Fix: I just grabbed the theme and have it locally. (@natea: Does using a CDN bring any value, if we're using AWS anyway?)

2. If DEBUG = False, you need to run collectstatic to get the files into the COMPRESS_ROOT:

UncompressableFileError: 'css/united-themed-bootstrap.responsive.css' could not be found in the COMPRESS_ROOT '/Users/chaz/dev/projects/coderaising/static/media' or with staticfiles.

Fix: python manage.py collectstatic -v3 (v3 = highly verbose)

Note: The error above happened b/c the incorrect URL, but collectstatic still needs to be run, even if you get the names right :)

3. Template now loads (no 500 error for the entire page), but there's a 500 error being thrown for for all the static assets:

[11/Mar/2013 00:16:40] "GET / HTTP/1.1" 500 5245
[11/Mar/2013 00:16:41] "GET /static/CACHE/js/4300e8d50956.js HTTP/1.1" 500 5339
[11/Mar/2013 00:16:41] "GET /static/CACHE/css/abd643766b6b.css HTTP/1.1" 500 5343
[11/Mar/2013 00:16:41] "GET /static/mezzanine/css/editable.css HTTP/1.1" 500 5343
[11/Mar/2013 00:16:41] "GET /static/mezzanine/js/editable.js HTTP/1.1" 500 5339
[11/Mar/2013 00:16:41] "GET /static/mezzanine/js/jquery.form.js HTTP/1.1" 500 5345
[11/Mar/2013 00:16:41] "GET /static/mezzanine/js/jquery.ba-resize.js HTTP/1.1" 500 5355
[11/Mar/2013 00:16:41] "GET /static/mezzanine/js/jquery.tools.toolbox.expose.js HTTP/1.1" 500 5377
[11/Mar/2013 00:16:41] "GET /static/mezzanine/js/jquery.tools.overlay.js HTTP/1.1" 500 5363

Fix:

  1. Check that those assets are there. Yep, they are.
  2. This Q & A clears it up: The static files are only served by Django when DEBUG = True. Otherwise, your web server needs to serve them.
  3. TODO: Set up Foreman to run with gunicorn for local debugging.

@natea: I'm going to bed! Tried to run it locally with DEBUG = True, and then I get the 404 error like I had last time we talked. I even cloned the repo fresh this time, and since you're changes are up-to-date, I don't get the 404? I only have the database settings and the DEBUG = False setting in my local_settings.py.

On the topic of local_settings.py, both 2 Scoops and Randall Degges in The Definitive Guide to Deploying Django, recommend having dev settings under source control. It's a bit of a side point, but wanted to throw it out there, as we had talked about our preferences on project structure.