LoginSignup
2
2

More than 5 years have passed since last update.

ember-cli-railsでrailsのフロントエンド開発がもっといい感じになる

Posted at

ember-cli

ember.jsはjavascriptのフレームワークで、ember-cliはemberコマンドでgenerateしたりtestしたりbuildする便利な実行環境のようなものです。

Ember CLI | A command line utility for creating ambitious web applications
http://www.ember-cli.com/

ember.jsで本格的に開発するならなるべくember-cliを使ったほうがいいです。
addonも沢山ありますし、testが書きやすいし、ES6で書けるしいいことだらけです。

ember-cli-rails

その名の通りember-cliとrailsの環境をつなげるものです。
asset-pipelineがember-cliのbuildを実行してrailsのviewにemberを埋め込むのがかなり楽になります。

rwz/ember-cli-rails
https://github.com/rwz/ember-cli-rails

GithubからREADMEを読めば普通に動くと思います。

railsのassetsが参照しづらかった

スタイルシートはember-cli内でsassが使えますし特に問題にならないのですが、railsのapp/assets/images以下に置いた画像なんかが参照しづらいのがネックでした。

なのですが今日以下のプルリクエストを発見したのですべて解決した感じです。

これ自体とてもシンプルなことしかしていないのでEmberAssetsHelperをコピペしてちゃんと手元のrailsで動きました。

こんな感じのhelperでemberのtemplateからapp/assets/images以下のファイルを参照できるようになります。

{{rails-image "cat.jpg"}}

classとかaltとか属性を設定したいならrails-imageをcomponentにしておくと捗ると思います

2
2
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
2
2