如何使用滑軌資產管道

時，而不是具有頁面內聯CSS包括帶有鏈接的樣式標記在哪裏得到的CSS，我可以使用Rails' stylesheet_link_tag helper方法添加到我的觀點，我想有css直接在頁面內嵌入。如何使用滑軌資產管道

這是我想出了迄今：

%style(type="text/css")=File.read(physical_asset_path("email.css"))

但我找不到任何Rails的helper方法，這給了我一個資產的物理路徑 - physical_asset_path是發明只是一個虛擬的方法我。

任何人都知道如何使用Rails 3.2.x中時，獲得資產的物理路徑？

有沒有更簡單/更好的方式來獲得樣式表 - 從css文件共軌資產路徑內 - 內聯？

使用案例：大多數電子郵件客戶端不訪問外部資源（如CSS，圖像），而無需用戶確認。爲了讓電子郵件正確顯示，我需要將CSS嵌入到電子郵件的HTML中。

來源

2012-04-30 gucki

使用premailer或premailer-Rails3中

https://github.com/fphilipe/premailer-rails3 或 https://github.com/alexdunae/premailer

喬的書呆子黨說：

我們還使用了Premailer寶石自動內聯在電子郵件中的鏈接樣式表觀點。我們的電子郵件佈局看起來像：

%html 
    %head 
    = stylesheet_link_tag 'email' 

    %style{:type => "text/css"} 
     :sass 
     @media all and (max-width: 480px) 
      table#container 
      width: auto !important 
      max-width: 600px !important 
     ... and so on for the mobile code 

    %body 
     Email body here. 
     %table 
     Lots of tables.

我們在HTML樣式表。 Premailer會下載它，處理它，並將內嵌的css規則插入到HTML中。

@media規則需要在電子郵件佈局中內聯，因爲 Premailer無法處理那些在單獨的css文件中。

我們使用premailer-Rails3中以Premailer集成到Rails 3 不幸的是，我們發現一堆premailer bug和 premailer-Rails3中的。我們項目的叉在 https://github.com/joevandyk/premailer和 https://github.com/joevandyk/premailer-rails3。叉修復一些編碼錯誤，消除由 premailer-Rails3中做了一些奇怪的CSS處理的東西，讓premailer不剔除在電子郵件中嵌入佈局規則，和其他一些東西。

我們還發現了一個sass-rails中的錯誤，您無法在 inline sass代碼中嵌入圖像網址。請參閱https://github.com/rails/sass-rails/issues/71 Premailer-rails3掛接到ActionMailer，當郵件實際上是交付時，不只是生成。在運行測試時，電子郵件並非實際發送的，所以在測試期間，premailer-rails3掛鉤不會運行。我沒有花時間去查看是否有可能在測試期間運行預編譯器處理，但這將是一個不錯的要做的事情。

另外，我們在premailer-rails3上的分支假設你想要預製器外出並實際下載鏈接的CSS文件。它應該是可能使用Rails 3.1資產管道獲取處理的css 而不下載它。非常特別的感謝喬丹Isip誰做了超級煩人的工作，以確保電子郵件在所有外觀不同的客戶看起來不錯。寫這個CSS/HTML沒有看起來的樂趣。

更新：

Roadie似乎是一個更好的選擇。感謝塞斯布羅指出。

來源

2012-04-30 16:18:15

偉大的東西，謝謝！ :) – gucki

您叉不爲我工作，所以我最終創建自己的叉子，改變它的做法：https://github.com/phuongnd08/premailer-rails3/ –

我有更好的運氣長期使用[視Roadie]（https://github.com/Mange/roadie）。最後我檢查了（幾年前），premailer-rails有一些怪癖。 –

Rails.application.assets.find_asset('email').to_s將作爲字符串返回編譯後的資產。

來源

2012-08-01 20:37:37

這就是我正在尋找的東西。謝謝！ – jpadvo

不幸的是，資產將不會被壓縮 – haimg

+16

這是行得通！但有必要添加一個'.html_safe'，這樣它就不會引號：'Rails.application.assets.find_asset（'email'）。to_s.html_safe' – hsgubert

無法對Seth Bro的回答添加評論。您最好使用#[]而不是#find_asset： Rails.application.assets["email"].to_s。

「資產將不會被壓縮」。這不是真的。

Rails.application.configure do 
    # ... 
    config.assets.css_compressor = :sass 
    config.assets.js_compressor = :uglify 
end

注意，在默認情況下，這是在生產環境（config/environments/production.rb）啓用：如果您啓用壓縮機（在軌配置）將被壓縮。

來源

2013-07-24 22:02:12 ixti

你能舉一個你說的壓縮機的例子嗎？我無法得到它壓縮。 –

添加了一個示例來回復。 – ixti

似乎在生產中不起作用。任何工作？資產似乎沒有。 –

TL;博士（無視Roadie）：

%style(type="text/css") 
    = render template: '../assets/stylesheets/email_responsive.css'

對於實際應用的CSS的內聯樣式，我建議roadie-rails（這是Rails包裝器Roadie）。它也有其他的整齊的功能，如絕對值化href S，src小號等

的使用結合兩種內聯（email.scss）和非內聯（email_responsive.css）樣式表，都駐留在app/assets/stylesheets：

-# This will be inlined and applied to HTML elements. 
-# Note that you need to include this in your asset config, e.g.: 
-# Rails.application.config.assets.precompile += %w(... email.css) 
-# (You need to list it as `email.css` even if it's actually `email.scss`.) 

= stylesheet_link_tag 'email' 


-# E.g. for media queries which can't be inlined - yeah, some iOS devices support them. 
-# This will not be inlined and will be included as is (thanks to `data-roadie-ignore`). 
-# `template:` marks it as a full template rather than a partial and disables `_` prefix. 
-# We need to add the extension (`.css`) since it's non-standard for a view. 

%style(type="text/css" data-roadie-ignore) 
    = render template: '../assets/stylesheets/email_responsive.css'

來源

2015-12-24 22:38:30

（很抱歉，這答案是html，不HAML ......但這不應該成爲HAML風扇有問題）

我發現，當這個問題LO請聯繫Sass編輯爲css轉換爲html以創建html電子郵件模板。

綜合以上意見，我曾經在我的html頁的head下面的代碼：

<style type="text/css"> 
    <%= Rails.application.assets['path/to/sass/file'].to_s.html_safe %> 
</style>

此代碼編譯爲Sass和CSS然後插入CSS爲<style>標籤。 html_safe確保在css中使用的任何引號（'和"）或尖括號（>和<）不會被轉義。

的path/to/sass/file是一樣創建一個樣式表的鏈接標籤時，你可以使用：

<%= stylesheet_link_tag 'path/to/sass/file', :media => 'all' %>

來源

2016-02-08 21:51:34

Rails.application.assets['asset.js']將只在當地的環境，如導軌資產編譯在生產和暫存環境中禁用。

Rails.application.assets_manifest.find_sources('asset.js').first.to_s.html_safe應使用使用滑軌資產管道時，內聯CSS。

來源

2016-09-28 07:06:38 ThisIzKp

該解決方案適用於我的生產。 –

我試圖內嵌CSS在與谷歌的軌道兼容功放使用的頁面。我從vyachkonovalov找到了以下幫手，這是我在生產和本地工作中唯一的一件事。

添加以下到erb模板：

<style amp-custom> 
    <%= asset_to_string('application.css').html_safe %> 
</style>

而且幫手ApplicationHelper。它在當地和生產中完美運作。

module ApplicationHelper 
    def asset_to_string(name) 
    app = Rails.application 
    if Rails.configuration.assets.compile 
     app.assets.find_asset(name).to_s 
    else 
     controller.view_context.render(file: File.join('public/assets', app.assets_manifest.assets[name])) 
    end 
    end

來源

2016-11-16 10:06:56

如何使用滑軌資產管道

回答

相關問題