为了账号安全,请及时绑定邮箱和手机立即绑定

Django实现压缩静态文件

标签:
Premiere

在网站开发阶段,对于静态资源文件比如JS,CSS等文件都是未经过压缩合并处理的,这对于访问量巨大的网站来说不仅浪费带宽,而且也会影响网站的访问速度。

django-compressor可以把js/css等静态文件压缩,这样不仅有利于减少网站的请求次数,还能节省网络带宽。

而这篇文章即是介绍使用如何使用Python的Django框架中的压缩组件django-compressor!

下面就介绍如何在Django中集成django-compressor!

安装django-compressor

安装很简单,pip安装下就可以了:

$ pip install django-compressor

然后在'setting'的INSTALLED_APPS中添加

INSTALLED_APPS = [    #others
    'compressor']

setting配置

首先确保django.contrib.staticfiles已经包含在INSTALLED_APPS中,django1.6及以上版本是默认包含该app在其中的.

指定STATIC_URL

STATIC_ROOT = os.path.join(SITE_ROOT, 'collectedstatic')# STATIC_URL是客户端访问静态资源的根路径配置 STATIC_URL = '/static/'STATICFILES = os.path.join(BASE_DIR, 'static')

配置STATICFILES_FINDERS

默认django会从每个app目录的static子目录下查找静态文件,因此通常情况下你都是将相关静态文件放在各自的app/static目录下。Django怎么知道从app/static目录查找静态文件呢?Django有个默认配置项STATICFILES_FINDERS:

STATICFILES_FINDERS = (    'django.contrib.staticfiles.finders.FileSystemFinder',    'django.contrib.staticfiles.finders.AppDirectoriesFinder',    #other
    'compressor.finders.CompressorFinder',
)

添加django-compressor配置:

Django-Compressor开启与否取决于DEBUG参数,默认是COMPRESS_ENABLED 与 DEBUG 的值相反。因为 Django-Compressor 的功能本身是用在生产环境下项目发布前对静态文件压缩处理的。因此想在开发阶段 (DEBUG=True) 的时候做测试使用,需要手动设置 COMPRESS_ENABLED=True

COMPRESS_ENABLED = TrueCOMPRESS_OFFLINE = TrueCOMPRESS_CSS_FILTERS = [    #creates absolute urls from relative ones
    'compressor.filters.css_default.CssAbsoluteFilter',    #css minimizer
    'compressor.filters.cssmin.CSSMinFilter']
COMPRESS_JS_FILTERS = [    'compressor.filters.jsmin.JSMinFilter']

使用

使用也很简单,模板文件中添加模板标签 <font color="red">{% load compress %}</font>

下面分别是css和js的使用方式

{% load compress %}
{% compress css %}<link rel='stylesheet' href='{% static 'blog/css/style.css' %}' type='text/css'/>{% endcompress %}
{% compress js %}<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="{% static 'blog/js/jquery-3.1.1.js' %}"></script>{% endcompress %}

接着先运行命令:

$ python manage.py collectstatic --noinput

所有静态资源都将拷贝到STATIC_ROOT指定的目录中。

然后运行命令:

$ python manage.py compress --force

这样就会把压缩后的文件放在 <font color="red">STATIC_ROOT</font> 目录下面,大功告成!!

每次修改了js、css文件后,都需要重新加载最新的文件到 <font color="red">STATIC_ROOT</font> 目录下去,因此需要重新运行命令:

$ python manage.py collectstatic --noinput



作者:緣來
链接:https://www.jianshu.com/p/5ed8c31a5e16


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消