Tech Racho エンジニアの「?」を「!」に。
  • インフラ
  • 開発

Rails 3.1以降のassets pipelineでjQuery UIを簡単に使う

Rails 3.1以降で導入されたassets pipelineは、HTTPリクエストが目に見えて減る、すばらしいものです。

ただ、productionモードで無いと通常precompileしないので、プロジェクト開始時からassets導入していない場合、地味にめんどくさいんですよね。
一部のライブラリ内にsyntax errorがあったりして、ムキーッとなってassetsを無効にしてしまった人もいると思います。

jQuery UIも、デフォルトではCSSディレクトリ内に画像があり、相対パスがうまく解決できず画像が読み込まれないことがあります。
ただこれ、実はstylesheets/imagesディレクトリに画像を直接置くだけで、簡単に動作するんですね。

  • app
    • assets
      • images
        • (ここにはjquery-uiの画像を置かない)
      • javascripts
      • stylesheets
        • images
          • ui-bg_flat_0_aaaaaa_40x100.png
          • ui-bg_flat_75_ffffff_40x100.png
          • ...
        • ui-lightness
          • jquery-ui-1.8.22.custom.css
          • (ここには画像を置かない)
    • controllers
    • models
    • views

ファイル名がかぶらない限り、CSS部分は変更せずに運用可能です。
また、CSS/JSはprecompile時に圧縮されるので、minバージョンを使う必要もないですね。

知ってる人には当然のことかと思うのですが、assetsはいつもproduction環境作ってから気づくので、良かった良かった。


CONTACT

TechRachoでは、パートナーシップをご検討いただける方からの
ご連絡をお待ちしております。ぜひお気軽にご意見・ご相談ください。