はじめに
webpackを導入する際、検索するときにdocker
を含めて検索し忘れた方向けの記事です。なぜなら、docker rails webpack
と検索すれば丁寧な記事が見つかるから!
そうしなかった私が、webpackの導入に悩んだ内容をメモとして残します。
邪道
Rails環境はできていて、Vue.jsをwebpackを使おうと思って、導入方法の記事を参考に以下の手順で行いました。
①yarnのインストール
$ brew install yarn
yarnのインストールだけで1時間以上かかりました。。
②webpackのインストール
$ docker-compose run web rails webpacker:install
Webpacker requires Node.js >= 6.0.0 and you are using 4.8.2
はい。Node.jsのバージョンが違うらしい。apt-getも使えないので詰みました。
正攻法
Dockerfileに追記するだけ。
Dockerfile
.
.
RUN apt-get update -qq && apt-get install -y build-essential libpq-dev
########################################################################
# yarnパッケージ管理ツールをインストール
RUN apt-get update && apt-get install -y curl apt-transport-https wget && \
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add - && \
echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list && \
apt-get update && apt-get install -y yarn
# Node.jsをインストール
RUN curl -sL https://deb.nodesource.com/setup_7.x | bash - && \
apt-get install nodejs
########################################################################
WORKDIR /tmp
.
.
$ docker-compose run web bundle exec rails webpacker:install
Starting hoge_db_1 ... done
RAILS_ENV=development environment is not defined in config/webpacker.yml, falling back to production environment
create config/webpacker.yml
Copying webpack core config
create config/webpack
create config/webpack/development.js
create config/webpack/environment.js
create config/webpack/production.js
create config/webpack/test.js
.
.
Webpacker successfully installed 🎉 🍰
問題なくインストールできました。