3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Rails】SprocketsによってコンパイルされたCSSを文字列として取得する方法

Posted at

Railsでは通常、layoutファイルでstylesheet_link_tagメソッドを使ってSprocketsによってコンパイルされたCSS(元々app/assets/stylesheets/application.css等に書いていたCSS)を参照します。

app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
  <head>
    <!-- 略 -->
    <%= stylesheet_link_tag "application" %>
  </head>

背景を説明すると長くなるので省略しますが、とある事情でこのコンパイルされたCSSを文字列として取得する必要が出てきました。(簡単にいうと、<link href="..." >でcssファイルにリンクするのではなく、HTMLに直接スタイルシートのコードを埋め込む必要があった)

いろいろ調べた結果、以下のようなコードで取得できることがわかりました。

Sprockets::Railtie
  .build_environment(Rails.application, true)['application.css']
  .to_s
#=> "html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0} ..."

以下はその使用例です。

<!DOCTYPE html>
<html>
  <head>
    <style>
      <%# SprocketsによってコンパイルされたCSSをHTMLに直接埋め込む %>
      <%= Sprockets::Railtie.build_environment(Rails.application, true)['application.css'].to_s %>
    </style>
  </head>

こうしたテクニックを使う場面は滅多にないと思いますが、もし同じような状況に遭遇したら参考にしてみてください。

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?