如何在已安装的 sinatra 应用程序的 CSS 文件中写入可移植图像路径？

How to write portable image paths in CSS files for a mounted sinatra app?

背景

您正在编写一个 sinatra（或机架）应用程序，并且希望能够在不更改代码的情况下将其用作独立应用程序或安装的应用程序。

也就是说，您可以 运行 这个应用程序本身，或者您可以通过在 "config.ru" 中执行以下操作将其作为子应用程序安装在其他应用程序中：

run Rack::URLMap.new("/" => MainApp.new, 
                     "/my_mounted_app" => MountedApp.new)

一切似乎都很顺利，因为您在所有视图中小心使用 sinatra's url() helper，确保无论您的应用程序如何或是否安装，都会生成正确的路径。

问题

但是现在你想在 CSS 文件中包含一个图像作为背景，你 运行 进退两难：

  1. 在 CSS 文件中使用 url() 辅助方法。这可确保您的图像路径正确且可移植，但现在您的 CSS 文件必须由 sinatra 处理每个请求。
  2. 使用构建过程，可能涉及 SASS 和一些具有您的应用程序安装路径的全局配置文件，以生成具有正确图像路径的 CSS 文件。这也确保了正确的路径，但引入了构建过程的复杂性。

还有第三种更好的选择吗？使用 URLMap 安装应用程序的真正问题是什么 - 是否有另一种实现安装的方法可以避免这些问题？

同样，目标是：

  1. 完全便携的应用程序，无需任何更改即可安装。
  2. 不需要sinatra处理的静态资源
  3. 没有静态资产构建过程。

您可以在 CSS 中使用亲戚 URL。

因为 CSS 和图像都在 public 目录下，所以它们之间的相对路径在整个应用程序安装的任何地方都是相同的。