Django compressor django压缩器:具有相对于文件夹的路径的CSS图像

Django compressor django压缩器:具有相对于文件夹的路径的CSS图像,django-compressor,Django Compressor,我将django Compressor用于部署在heroku上的应用程序,amazon S3提供静态文件。一切正常,只是背景image:url()中引用的css中的图像没有以正确的路径呈现 我的静态文件按以下目录结构组织: -static -myapp -js -css -img -bootstrap -js -css -img -othervendor -js

我将django Compressor用于部署在heroku上的应用程序,amazon S3提供静态文件。一切正常,只是背景image:url()中引用的css中的图像没有以正确的路径呈现

我的静态文件按以下目录结构组织:

-static
    -myapp
        -js
        -css
        -img
    -bootstrap
        -js
        -css
        -img
    -othervendor
        -js
        -css
        -img
因此,我在url()中使用的路径是相对于css文件的:

url("../img/icon.png")
我的所有css文件都被压缩并移动到我的静态目录中的缓存文件夹中,缓存目录的url正确呈现为:

https://mybucket.s3.amazonaws.com/static/CACHE/css/somehash.css
问题在于css文件url()中的图像呈现为:

https://mybucket.s3.amazonaws.com/static/CACHE/img/imagefile.png
它应该是:

https://mybucket.s3.amazonaws.com/static/myapp/img/imagefile.png
或者,如果将图像复制到缓存目录,则可以:

https://mybucket.s3.amazonaws.com/static/CACHE/img/imagefile.png
我的临时解决方案是将css中的图像路径更改为以下路径,并且可以正常工作:

url("/static/foldername/img/icon.png")
我是django&compressor的新手,所以我不确定正确的行为应该是什么,但这似乎并不正确。在我看来,如果我能让django compressor做两件事中的一件,这个问题就可以解决:1)将css url()中引用的所有图像复制到CASHE/img目录,或2)呈现由..表示的正确url/ 以下是我的设置:

我的模板中的css文件位于{%compress css%}块中

s3utils.py(用于在我的bucket中创建单独的媒体和静态目录)

设置.py

DEFAULT_FILE_STORAGE = 'myapp.settings.s3utils.MediaRootS3BotoStorage'
STATICFILES_STORAGE = 'myapp.settings.s3utils.StaticRootS3BotoStorage'

AWS_ACCESS_KEY_ID = os.environ.get('AWS_ACCESS_KEY_ID')
AWS_SECRET_ACCESS_KEY = os.environ.get('AWS_SECRET_ACCESS_KEY')
AWS_STORAGE_BUCKET_NAME = os.environ.get('AWS_STORAGE_BUCKET_NAME')

S3_URL = 'http://%s.s3.amazonaws.com/' % AWS_STORAGE_BUCKET_NAME
MEDIA_URL = S3_URL+'media/'
MEDIA_ROOT = S3_URL+'media/'
STATIC_URL = S3_URL+'static/'
STATIC_ROOT = S3_URL+'static/'

COMPRESS_STORAGE = STATICFILES_STORAGE 
COMPRESS_URL = STATIC_URL
COMPRESS_ROOT = STATIC_ROOT
我想一定有某种设置告诉压缩器将css url(“../img/image.png”)复制到CACHE/img目录???

我也有同样的问题

对我来说,它首先似乎是一个压缩机的问题。我更改了前缀为S3的存储后端

StaticS3Backend = lambda: S3BotoStorage(location='static')

因为另一个方法没有正确设置位置值(它保持为空)


这为我解决了这个问题。

我根本没有找到任何好的解决方案。 这里有一些很好的讨论

在CSS文件中,使用指向AmazonS3上图像url的绝对路径将使其正常工作。但不用说,这是愚蠢的。为什么我希望我的本地开发和测试环境都使用prod的映像?有时,这甚至是不可接受的。假设您想更改图像并测试一段时间。(您可以手动将新图像上载到s3,并手动将此图像的所有数千个css引用更改为新url。同样,愚蠢。)

更好的方法是在css中使用{{STATIC_URL}}来构建绝对路径而不是相对路径。是的,如果添加此处提到的compressor.filters.template.TemplateFilter,则可以使用{{STATIC_URL}}。 这解决了多阶段问题。但是,它对本地开发不起作用,因为您没有在这里进行压缩,如果这样做,您将很难进行调试


就我个人而言,我觉得django compressor中的compressor.filters.template.TemplateFilter是错误的。它应该是django的一部分。您可以为css和js打开一个可选进程。

我最近遇到了这个问题,并通过设置
压缩\u输出\u DIR=''
解决了它。这导致压缩文件被保存在静态根目录中,而不是静态下的默认“缓存”目录中。

谢谢,我将对此进行研究,并告诉您是否有相同的结果。FWIW,此方法对我不起作用。我不得不回到lambda方法,因为它至少部分有效。我使用的是django压缩器==1.3、django存储==1.1.4和boto==2.8.0。
StaticS3Backend = lambda: S3BotoStorage(location='static')
class StaticS3Backend(S3BotoStorage):
    location = 'static'