Django Media Bundler 技术文档

1. 安装指南

环境要求

• Python 2.5 及以上版本

依赖项

• 对于图像精灵功能，需要安装以下依赖：
  • Python Imaging Library（在Ubuntu下称为python-imaging）
  • pngcrush

安装步骤

1. 克隆Django Media Bundler的源代码。
2. 将源代码放置在Django项目的PYTHONPATH中。
3. 在settings.py文件中，将media_bundler添加到INSTALLED_APPS列表中。

2. 项目的使用说明

配置媒体包

在settings.py文件中，描述你希望打包的JavaScript、CSS和图标。示例如下：

MEDIA_BUNDLES = (
    {"type": "javascript",
     "name": "myapp_scripts",
     "path": MEDIA_ROOT + "/scripts/",
     "url": MEDIA_URL + "/scripts/",
     "minify": True,  # 如果你想压缩源代码
     "files": (
         "foo.js",
         "bar.js",
         "baz.js",
     )},
    {"type": "css",
     "name": "myapp_styles",
     "path": MEDIA_ROOT + "/styles/",
     "url": MEDIA_URL + "/styles/",
     "minify": True,  # 如果你想压缩源代码
     "files": (
         "foo.css",
         "bar.css",
         "baz.css",
         "myapp-sprites.css"  # 包含生成的CSS文件
     )},
    {"type": "png-sprite",
     "name": "myapp_sprites",
     "path": MEDIA_ROOT + "/images/",
     "url": MEDIA_URL + "/images/",
     "css_file": MEDIA_ROOT + "/styles/myapp-sprites.css",  # 生成的CSS规则位置
     "files": (
         "foo.png",
         "bar.png",
         "baz.png",
     )},
)

模板中的使用

在模板顶部添加{% load bundler_tags %}，然后替换原有的JavaScript和CSS引用：

{% javascript "js_bundle_name" "myscript.js" %}
{% css "css_bundle_name" "mystyle.css" %}

如果需要一次性加载整个包，可以使用load_bundle标签：

{% load_bundle "js_bundle_name" %}
{% load_bundle "css_bundle_name" %}

如果启用了JavaScript延迟加载，请在模板底部插入{% deferred_content %}标签。

3. 项目API使用文档

主要API

• {% javascript "bundle_name" "file_name" %}：插入指定JavaScript文件。
• {% css "bundle_name" "file_name" %}：插入指定CSS文件。
• {% load_bundle "bundle_name" %}：加载整个包中的所有文件。
• {% deferred_content %}：插入延迟加载的JavaScript内容。

4. 项目安装方式

安装步骤

1. 克隆Django Media Bundler的源代码。
2. 将源代码放置在Django项目的PYTHONPATH中。
3. 在settings.py文件中，将media_bundler添加到INSTALLED_APPS列表中。

通过以上步骤，你就可以成功安装并使用Django Media Bundler来打包和管理你的JavaScript、CSS和图标资源。