docker × rails × vue.js で環境構築をしてみた。

##謝辞
下記に記載されている手順は少し前後があるかもしれません。
私は最初に参考サイトリンク先を参考にrailsの環境構築をしてからvueを導入しました。なのでgemfileもdockerfileもdocker-compose.ymlも
最初から下記の記述をしていた訳ではありません。手順6以降が怪しいのでご了承をお願いします。
コメントで指摘いただけますと幸いです。

都度、更新していきます。

#手順
1.Dockerfile,docker-compose.yml,gemfile,gemfile.lockを作成。
※Dockerfile,docker-compose.ymlについては下記に明記。

2.gemfileに下記を記載。

Gemfile

source 'https://rubygems.org'
gem 'rails', '~> 5.2.2'
gem 'webpacker', github: 'rails/webpacker'

3.gemfile.lockは中身は何も記載しなくてOK

4.アプリ新規作成

docker-compose run web rails new . --force --database=mysql --skip-bundle

5.database.ymlを修正

database.yml

default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password: password # docker-compose.ymlのMYSQL_ROOT_PASSWORD
  host: db # docker-compose.ymlのservice名

6.コンテナのビルド

$docker-compose build

7.vueを導入

$ docker-compose run web rails webpacker:install
$ docker-compose run web rails webpacker:install:vue

8.vue.js ファイルのビルド

$docker-compose run web bin/webpack

9.db作成

$docker-compose run web rails db:create

10.起動

$docker-compose up

##参考サイト
・丁寧すぎるDocker-composeによるrails5 + MySQL on Dockerの環境構築(Docker for Mac)

・Rails5.2 + Docker環境にVue.js (Webpacker) を導入する

・Vue.jsをつかったRuby on Railsプロジェクトのはじめかた(with Docker)

##Dockerfile

Dockerfile

ROM ruby:2.5.3
  
RUN apt-get update -qq && apt-get install -y build-essential
RUN curl -sL https://deb.nodesource.com/setup_10.x | bash
RUN apt-get install -y nodejs
RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add -
RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list
RUN apt-get update -qq && apt-get install yarn

RUN mkdir /app_name
ENV APP_ROOT /app_name
WORKDIR $APP_ROOT

ADD ./Gemfile $APP_ROOT/Gemfile
ADD ./Gemfile.lock $APP_ROOT/Gemfile.lock

RUN bundle install
ADD . $APP_ROOT

##docker-compose.yml

docker-compose.yml

ersion: '3'
services:
  db:
    image: mysql:5.7
    volumes:
      - db-volume:/var/lib/mysql
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: root
    ports:
      - "3306:3306"

  web: &app_base
    build: .
    command: rails s -p 3000 -b '0.0.0.0'
    volumes:
      - .:/app_name
      - bundle:/usr/local/bundle:delegated
      - node_modules:/app/node_modules:delegated
    ports:
      - "3000:3000"
    depends_on:
      - db
    tty: true
    stdin_open: true

  webpack:
    <<: *app_base
    command: "bin/webpack-dev-server"
    ports:
      - "3035:3035"
    depends_on:
      - web
    tty: false
    stdin_open: false

volumes:
  db-volume:
  bundle:
  node_modules: