Rails 5.1&Ruby 2.5.0&Vue.jsの開発環境をつくる
初詣のおみくじで「今年は全力で勉強しろ」と書かれていたので、さっそく勉強を初めてみる。以前から気になっていたフロントエンド周りを少しずつ触っていってみる。具体的なフレームワークとしてはvue.js。
というわけで'rails new'をしますが、最初からwebpackとvueを使う予定なので、yarnをインストールし、オプションをつけてnewします。あ、そういえばruby 2.5からbundlerがデフォになったんだっけ？まあとりあえずgem i bundlerしておく。
$ brew install yarn
$ rbenv gemset init foobar
$ gem i bundler
$ bundle init
Gemfileにrailsを書いてbundle install。
$ bundle
$ rails new . --webpack=vue
で、開発時はwebpackのコンパイルにwebpackerを立ちあげないといけないらしく、それを楽にするためにforemanを使用するのが良いらしいので導入。
Gemfile
gem 'foreman'
Procfileをルートディレクトリに作成し、以下のように書いて保存する。
Procfile
rails: rails s
webpack: ./bin/webpack-dev-server
そしたらforeman startでサーバーが起動します。
$ foreman start
って思ったらなんかエラーでた。
The RUBYGEMS_GEMDEPS environment variable is set. This enables RubyGems' experimental Gemfile mode, which may conflict
with Bundler and cause unexpected errors. To remove this warning, unset RUBYGEMS_GEMDEPS.
15:34:01 rails.1 | started with pid 45749
15:34:01 webpack.1 | started with pid 45750
15:34:01 webpack.1 | Unable to resolve dependency: user requested 'tzinfo-data (>= 0)'
15:34:01 webpack.1 | You may need to `gem install -g` to install missing gems
15:34:01 webpack.1 |
15:34:01 rails.1 | Unable to resolve dependency: user requested 'tzinfo-data (>= 0)'
15:34:01 rails.1 | You may need to `gem install -g` to install missing gems
15:34:01 rails.1 |
15:34:01 webpack.1 | Your `bin/bundle` was not generated by Bundler, so this binstub cannot run.
15:34:01 webpack.1 | Replace `bin/bundle` by running `bundle binstubs bundler --force`, then run this command again.
15:34:01 webpack.1 | exited with code 1
15:34:01 system | sending SIGTERM to all processes
15:34:01 rails.1 | terminated by SIGTERM
bundle binstubs bundler --forceしろと書かれています。ので、言われるがまま実行。
$ bundle binstubs bundler --force
これでforeman startしたら無事起動しました。というわけで、勉強を開始してみたいと思います。