In version 1.8, Django added support for multiple template engines, and provided a Jinja2 backend. The django-jinja project leverages that to support Jinja2, while Jingo does not.
django-jinja is recommended for new projects. Jingo >=0.8 supports Django 1.8, but it will not be maintained beyond version 0.9, and will not support Django 1.9 or above. If you're already using Jingo, and not ready to make the switch, Jingo should continue to work for now, though not without some effort.
0.9 will be the last release of Jingo, unless a new maintainer comes along with a new direction.
Since Jingo is no longer maintained, Jingo Minify is also deprecated.
As of 0.9, Jingo's built-in helpers are provided via a Jinja2 extension to simplify moving away from Jingo. The entire jingo/ext.py file can be copied into another project, or referenced as 'jingo.ext.JingoExtension'. Used in this way, Jingo plays nicely with django-jinja (and theoretically Django's built-in Jinja2 backend).
Jingo Minify is an CSS/JS bundler and minifier for use with Jingo, a connector to use Jinja2 templates with Django.
- Django 1.4
- Jingo and Jinja2. Jingo Minify is not designed for Django templates.
One of the following:
Optionally:
- less. Jingo Minify supports less, if you have
lesscavailable. - sass. Jingo Minify supports sass, if you have
sassavailable. - stylus. Jingo Minify supports stylus, if you have
stylusavailable.
Configure the following settings:
# Jingo Minify uses the YUICompressor internally, so needs Java.
JAVA_BIN = '/path/to/java'
# If you want to use less, set this:
LESS_BIN = '/path/to/lessc' # Probably just 'lessc'
# If you want to use sass, set this:
SASS_BIN = '/path/to/sass'
# If you want to use node-based minifiers, set these:
UGLIFY_BIN = '/path/to/uglifyjs' # Probably just 'uglify'
CLEANCSS_BIN = '/path/to/cleancss' # Probably just 'cleancss'
# If you want to use a specific git executable, set this:
GIT_BIN = '/path/to/git' # Default to 'git'
# If you use a different git root for assets
JINGO_MINIFY_ASSETS_GIT_ROOT = '.'
# If you want a different JINGO_MINIFY_ROOT than static
JINGO_MINIFY_ROOT = '/var/www/example.com/static/'
# Add jingo_minify to INSTALLED_APPS
INSTALLED_APPS = (
# ...
'jingo_minify',
# ...
)
# This is the important part.
MINIFY_BUNDLES = {
'css': {},
'js': {},
}Note: If you're using Django 1.4, but want to use MEDIA_ROOT and MEDIA_URL for static assets instead of conventional Django 1.4 STATIC_ROOT and STATIC_URL, you should also set:
JINGO_MINIFY_USE_STATIC = FalseJingo Minify deals with bundles, which lets you organize your code into multiple files but combine them into very few groups for your users to download.
Bundles are set up in the MINIFY_BUNDLES setting. For example:
MINIFY_BUNDLES = {
'css': {
'common': (
'css/reset.css',
'css/layout.css',
),
},
'js': {
'common': (
'js/lib/jquery.js',
'js/common.js',
),
},
}This creates one CSS bundle and one JS bundle, both called common. The file paths are relative to the MEDIA_ROOT setting.
You can create any number or combination of CSS and JS bundles, and include any number of files in each, but do not create empty bundles.
For development, you probably don't want to rebundle the files all the time. Just set
TEMPLATE_DEBUG = Truein your settings, and Jingo Minify will automatically use the uncompressed files. Set TEMPLATE_DEBUG to False to use the bundled versions.
To include a bundle in a template, use either the css or js functions. For example:
{# My Jinja2 Template #}
<html>
<head>
<title>My Page</title>
{{ css('common') }}
</head>
<body>
<h1>My page</h1>
{{ js('common') }}
</body>
</html>This will include the code (<link> and <script> tags) to include the bundles on the page. It will generate the HTML for either the individual files or the bundled files based on TEMPLATE_DEBUG.
The css() helper will, by default, generate <link> tags with a media attribute set to screen,projection,tv. You can override this by passing an optional second parameter to the css() helper, e.g.:
{{ css('print-bundle', 'print') }}This would create a <link> tag with media="print".
To bundle and minify your CSS and JS, run the management command:
./manage.py compress_assetsThis will create two files per bundle in your media directory, one that looks like bundle-all.js (or .css) and one that looks like bundle-min.js. Only the *-min.* version will be used. It also creates a file called build.py along side manage.py that contains unique IDs based on the SHA of the current git checkout.
You can choose between YUICompressor (Java) or UglifyJS/clean-css (node) for minifying. You don't have to do anything to get YUICompressor working.
If you want to use the node counterparts, just add UGLIFY_BIN and CLEANCSS_BIN (set to the correct paths, of course) to your settings.py. You can see the actual syntax if you look at the Installation section of this README.
Depending on your CDN, you may need to cache-bust assets referenced in the CSS. To do this, add the following to your settings:
CACHEBUST_IMGS = TrueIt will go through your CSS, and find any reference to local resources. It will append the short id for the commit that most recently modified the resource, so that it only cache busts resources that are actually modified.
The list of images that couldn't be found can be displayed by running the command with --verbosity=2 (or -v2).
manage.py compress_assets -v2Note
This is off by default. It does a lot of I/O, so be careful if you have large amounts of massive images. Additionally, it uses a hash of the file. This isn't 100% collision proof, but it should be more than good enough.
If you want to use less files and have LESS_BIN defined, LESS is supported automatically in a few ways.
- To use a LESS file, simply include a file in a CSS bundle that ends with
.less. - For development, if you want to use the LESS JavaScript runtime compiler, you'll have to figure out how to include it in your project.
- If you want to compile LESS on the server, even in development, add a setting:
LESS_PREPROCESS = True. Your LESS files will be recompiled on every request. - In production, LESS files are automatically compiled before being bundled with the rest of the CSS.
If you want to use sass or stylus files, you must define `SASS_BIN or STYLUS_BIN, respectively.
- To use a SASS or Stylus file, simply include a file in a CSS bundle that ends with
.sassor.scss(SASS) or.styl(Stylus). - Your SASS/Stylus files, if changed, will be recompiled on every request -even in development.
- In production, Sass/Stylus files are automatically compiled before being bundled with the rest of the CSS.
To run the tests:
$ python run_tests.py
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent