个人中心
gpt4 book ai didi

ruby-on-rails - 如何将 css 样式表包含到 wicked pdf 中？

转载 作者：行者123 更新时间：2023-12-03 14:24:22 26 4
gpt4 key购买 nike

我被困在 gem wicked_pdf 上。

  • 我正在生成一个 pdf 报告，并且我想包含样式表。
  • 样式表是通过 webpack 和 tailwindcss 生成的。

    • 在wicked_pdf doc中，据说我可以使用 wicked_pdf_stylesheet_pack_tag和 wicked_pdf_javascript_pack_tag从 webpack 中包含我的样式表和 javascript，但没有任何效果。

    这是来自 Controller 的代码: 

          format.pdf do
            render template: "pdf_reports/show", 
            layout: "wicked_layout",
            pdf: "report"
          end

    这是布局中的代码: 

    <!DOCTYPE html>
        <html>
            <head>
               <%= csrf_meta_tags %>
               <%= wicked_pdf_javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
               <%= wicked_pdf_stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
               <%= wicked_pdf_stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
          </head>
          <body>
            <%= yield %>
          </body>
    </html>

    以下是 pdf.erb View 中的代码: 

    <h1 class="text-red-base">Test pdf</h1>
    <h2 class="test-wicked">mldgmdjgfd</h2>

    它适用于 wicked_pdf_stylesheet_link_tag (从链轮应用 test-wicked:文本为蓝色)但不适用于 wicked_pdf_stylesheet_pack_tag (h1 应该是红色但不是)。

    知道发生了什么吗？

    谢谢!

    最佳答案

    分析

    webpack 助手做了几个可能并不适用于每个项目的假设。

    根据 running_in_develpment? 返回的内容，它们会产生两种不同的结果。对于 webpacker 3.0.0 或更高版本，此方法委托(delegate)给 Webpacker.dev_server.running? 。

    在没有运行开发服务器的情况下，帮助程序将假定 Assets 已预编译，并将尝试将 Assets 的内容粘贴到 <style> 或 <script> 标记中。如果 Assets 在生产环境中预编译 和 在应用程序运行的环境的文件系统中可用，这应该可以工作。这通常是正确的。

    随着开发服务器的运行，webpack 助手将返回一个标签，其中包含指向包 Assets 的 Assets 路径(最终使用标准的 asset_path 助手)。实际路径取决于 rails 配置。在某些情况下，路径将与 wkhtmltopdf 从 file://... 呈现的 html 不兼容:

  • 如果未设置 config.action_controller.asset_host，则 asset_path 将生成相对路径。这些不适用于从文件进行 wkhtmltopdf 渲染。
  • 如果设置了 config.action_controller.asset_host 将在整个应用程序中使用绝对 URL(这是控制 asset_path 返回内容的一般设置)。现在 wkhtmltopdf 可能能够获取 Assets ，如果它在可以解析和访问 Assets 主机的环境中运行。这在容器化应用程序中可能不是真的。

    • 附加约束

    在我们的例子中，我们有一些额外的限制:
  • 我们的 PDF 发射 Action 支持使它们将 show_as_html: true 传递给 render 的参数。这使得 wicked_pdf 跳过 PDF 生成并返回中间 HTML。我们使用它来调试浏览器中的 HTML View 。此 html 将由开发人员的浏览器在与 wkhtmltopdf 运行的环境不同的环境中呈现。
  • 我们的开发设置是单线程的，因为我们使用 better_errors 调试器，它依赖于由同一应用程序实例服务的所有请求。另一方面，我们在请求中呈现 PDF。这意味着 wkhtmltopdf 将无法从应用程序请求 Assets (例如，通过将 host: "localhost:3000" 传递给 asset_path )，因为它已经占用了唯一可用的线程。

    • sample 溶液

    我们的解决方案是实现我们自己的助手，这些助手更了解我们的设置。
  • 在生产中，默认行为与我们的设置兼容，因此我们委托(delegate)给原始的，它将在文件系统中查找 Assets 并将它们包含在生成的 HTML 中。
  • 在开发中，当生成 PDF 时，我们将 webpack 开发服务器的主机名/端口传递给 webpacker 标签助手(这会将它们传递给 asset_path )。开发服务器在单独的进程中运行，因此即使应用程序在请求处理程序中也会响应。
  • 在开发中，当返回中间 HTML(由我们的自定义帮助程序 show_as_html? 确定)时，不要将 host: 传递给 asset_pack_url ，这将导致与应用程序的其余部分一样的“正常” Assets 路径，这将在浏览器中工作。 

    • module PdfHelper
      def pdf_stylesheet_pack_tag(source)
        if running_in_development?
          options = { media: "all" }
          wds = Webpacker.dev_server
          options[:host] = "#{wds.host}:#{wds.port}" unless show_as_html?
          stylesheet_pack_tag(source, options)
        else
          wicked_pdf_stylesheet_pack_tag(source)
        end
      end

      def pdf_javascript_pack_tag(source)
        if running_in_development?
          options = {}
          wds = Webpacker.dev_server
          options[:host] = "#{wds.host}:#{wds.port}" unless show_as_html?
          javascript_pack_tag(source, options)
        else
          wicked_pdf_javascript_pack_tag(source)
        end
      end
    end

    在 pdf 布局中 (slim) 
    html
      head
        ...
        = pdf_stylesheet_pack_tag "pdf"
        = pdf_javascript_pack_tag "pdf"
        ...

    关于ruby-on-rails - 如何将 css 样式表包含到 wicked pdf 中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58490299/

    26 4 0
    文章推荐： c# - 如何在 ASP.NET Core 中为 gRPC 服务添加全局异常处理程序？
    文章推荐： c# - ASP.NET Core 3.0 中获取当前经过身份验证的用户名的方法是什么？
    文章推荐： eclipse - 未找到模块 java.xml.bind
    文章推荐： firebase - 为什么我不能创建 Google Analytics 属性 View ？
    行者123
    个人简介

    我是一名优秀的程序员,十分优秀！

    滴滴打车优惠券免费领取
    滴滴打车优惠券
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com