css - 尊重相对 url 引用的构建时 CSS 组合器？

Question

寻找尊重相对 URL 引用的构建时 CSS 组合器/缩小器。

也就是说，如果我正在合并的文件之一位于

/path/to/style.css

并包含

background-image: url(images/my-image.png)

生成的文件应该包含

background-image: url(/path/to/images/my-image.png).

应该可以在 Mac 和 PC 上跨平台工作，因此通过 Mono 或 Node 的 .NET 似乎是显而易见的选择。

Answer 1

查看 WebAssets / Github

Asset management application for Python web development - use it tomerge and compress your JavaScript and CSS files.

它包括 cssmin、cssutils、yui_css、less、sass、clevercss、compass、scss、coffeescript、gzip 等的过滤器/预编译。

具体到你的问题:

cssrewrite 重写 CSS 文件中的相对 URL 的源过滤器。

CSS allows you to specify urls relative to the location of the CSSfile. However, you may want to store your compressed assets in adifferent place than source files, or merge source files fromdifferent locations. This would then break these relative CSSreferences, since the base URL changed.

This filter transparently rewrites CSS url() instructions in thesource files to make them relative to the location of the output path.It works as a source filter, i.e. it is applied individually to eachsource file before they are merged.

No configuration is necessary.

The filter also supports a manual mode:

get_filter('cssrewrite', replace={'old_directory', '/custom/path/'})

This will rewrite all urls that point to files within old_directory to use /custom/path as a prefix instead.

一般用法:

from webassets import Environment
my_env = Environment('../static/media', '/media')

""""As you can see, the environment requires two arguments,
the path in which your media files are located, as well as     
the url prefix under which the media directory is available. 
This prefix will be used when generating output urls.  Next, 
you need to define your assets, in the form of so called 
bundles, and register them with the environment. The easiest     
way to do it is directly in code:""""

from webassets import Bundle
js = Bundle('common/jquery.js', 'site/base.js', 'site/widgets.js', filters='jsmin', output='gen/packed.js')
my_env.register('js_all', js)

在这种情况下，您将用 output 替换您的 js src。这是另一种表示法:

directory: ../static
url: /media
debug: True
updater: timestamp

bundles:
    bundle-name:
        filters: sass,cssutils
        output: cache/default.css
        contents:
            - css/jquery.ui.calendar.css
            - css/jquery.ui.slider.css

还有针对 Django、Flask、Jinja2、Werkzeug 的特殊 Hook 。

Documentation is here.希望这对您有所帮助!