从 Rails CSS 文件中为 wicked PDF 渲染图像

Question

通过相对于嵌套级别的图像来识别对象的级联嵌套：

#nestedlist, #nestedlist li {
  font-size: 12px;
  list-style-type: none;
}
#nestedlist ul  {
  list-style-image: url("/yellow_dark.png"); 
} 
/* UL Layer # Rules based on quantity_of_ul */
#nestedlist ul ul  {
  list-style-image: url("red_base.png"); 
}
#nestedlist ul ul ul {
  list-style-image: url("/green_light.png");
}

等等

无论图像位于公共目录还是资产目录中，这都会在浏览器中正确呈现。然而 wicked PDF 需要图像的绝对路径，无法处理上述情况；如果

list-style-type: none;

它将返回空白，如果未指定则返回黑色子弹。 尝试使用

list-type: square;

，但是，唉，没有颜色选项。

如何将 css 文件转换为由 wicked_pdf 的

pdf

布局调用的预编译 css 文件中的图像提供绝对 URL？

Answer 1

你必须配置

asset_host

，因为，当没有具体设置时，wickedpdf将使用本地

file://

网址，这对我来说不起作用：

if pathname =~ URI_REGEXP
  # asset_path returns an absolute URL using asset_host if asset_host is set
  pathname
else
  File.join(Rails.public_path, asset.sub(/\A#{Rails.application.config.action_controller.relative_url_root}/, ''))
end

https://github.com/mileszs/wicked_pdf/blob/2.6.3/lib/wicked_pdf/wicked_pdf_helper/assets.rb#L131

---

# config/environment/development.rb

config.action_controller.asset_host = "http://localhost:3000"

/* app/assets/stylesheets/pdf.css */

ul {
  list-style-image: url("circle.svg");
}

<!-- show.pdf.erb -->

<%= wicked_pdf_stylesheet_link_tag "pdf" %>

<ul>
  <li>Peaches</li>
  <li>Apples</li>
  <li>Plums</li>
</ul>

wicked_pdf_stylesheet_link_tag

助手现在输出：

<style type='text/css'>
ul {
  list-style-image: url(http://localhost:3000/assets/circle-a438dbaaf222a262201c1d46bd32e81d2ecb96f95fd50d00a5ad9b57a7778248.svg);
}
</style>