質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Docker

Dockerは、Docker社が開発したオープンソースのコンテナー管理ソフトウェアの1つです

解決済

Dockerコンテナ上でのみ、RailsアプリにTailwind CSSが反映されない

hajsu00
hajsu00

総合スコア117

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Docker

Dockerは、Docker社が開発したオープンソースのコンテナー管理ソフトウェアの1つです

1回答

0評価

0クリップ

168閲覧

投稿2022/05/18 01:41

編集2022/05/27 21:19

Nginx + Rails + MySQLをそれぞれ別コンテナに入れて環境構築を試みています。

nginxコンテナにブラウザから"localhost:80"でアクセスしたところ、Railsのrootページの表示に成功しました。しかし、Tailwind CSSが反映されずに長時間解決できずにいます。

ご助言をいただけると幸いです。

起きている問題

tailwind.config.jsのPurge設定が正しいこと(多分)およびrails tailwindcss:buildでビルドができていることを確認しているが、Tailwind CSSが反映されない。
また、ローカルで"localhost:3000"に直接アクセスすると正常にTailwind CSSが反映される(どちらもdevelopment環境)。

開発環境

・macOS Monterey v12.1
・ruby v3.0.3
・Rails v6.1.4.4
・MySQL 8.0.28
・puma 5.5.2
・nginx 1.21.6

ディレクトリ構成

ローカル:/Users/my_user/Documents/project/myapp/src

directories

myapp ├── nginx ├── src # Rails │ ├── app │ │ ├── assets │ │ │ ├── builds │ │ │ │ ├── tailwind.css │ │ │ └── ... │ │ └── ... │ ├── ... │ ├── Dockerfile │ ├── tailwind.config.js │ └── ... ├── ... └── docker-compose.yml

コンテナ:/var/www/myapp

directories

/var/www └── myapp # Rails ├── app │ ├── assets │ │ ├── builds │ │ │ ├── tailwind.css │ │ └── ... │ └── ... ├── ... ├── Dockerfile ├── tailwind.config.js └── ...

Tailwind CSS設定

js

# tailwind.config.js module.exports = { purge: ["./app/**/*.{html,js}"], theme: { extend: {}, }, plugins: [], }

docker-compose.yml

yml

version: '3' services: nginx: container_name: nginx build: context: . dockerfile: ./nginx/Dockerfile ports: - 80:80 volumes: - ./src:/var/www/myapp - ./nginx/myapp.conf:/etc/nginx/conf.d/myapp.conf - ./nginx/nginx.conf:/etc/nginx/nginx.conf tty: true app: container_name: myapp_app build: context: . dockerfile: ./src/Dockerfile command: bundle exec puma -C config/puma.rb volumes: - ./src:/var/www/myapp - ./src/vendor/bundle:/var/www/myapp/vendor/bundle environment: TZ: 'Asia/Tokyo' RAILS_ENV: development ports: - 3000:3000 depends_on: - db - nginx tty: true db: image: mysql:8.0.28 container_name: myapp_db volumes: - ./etc/my.cnf:/etc/mysql/conf.d/my.cnf - myapp_data:/var/lib/mysql environment: MYSQL_ROOT_HOST: '%' MYSQL_ROOT_PASSWORD: ${DATABASE_PASSWORD} TZ: 'Asia/Tokyo' command: --default-authentication-plugin=mysql_native_password ports: - 3306:3306 env_file: - .env tty: true volumes: myapp_data: external: true

Dockerfile

Nginx

dockerfile

FROM nginx:1.21 # インクルード用のディレクトリ内を削除 RUN rm -f /etc/nginx/conf.d/* # Nginxの設定ファイルをコンテナにコピー ADD nginx/myapp.conf /etc/nginx/conf.d/myapp.conf ADD nginx/nginx.conf /etc/nginx/nginx.conf # ビルド完了後にNginxを起動 CMD /usr/sbin/nginx -g 'daemon off;' -c /etc/nginx/nginx.conf

Rails

dockerfile

FROM ruby:3.0.3 RUN apt-get update -qq && apt-get install -y nodejs RUN mkdir -p /var/www/myapp WORKDIR /var/www/myapp COPY /src/Gemfile /var/www/myapp/Gemfile COPY /src/Gemfile.lock /var/www/myapp/Gemfile.lock RUN bundle install COPY . /var/www/myapp # Add a script to be executed every time the container starts. COPY /src/entrypoint.sh /usr/bin/ RUN chmod +x /usr/bin/entrypoint.sh ENTRYPOINT ["entrypoint.sh"] # Start the main process. CMD ["rails", "server", "-b", "0.0.0.0"] CMD ["tailwindcss", "build"]

ローカルとコンテナでディレクトリ構造が違うためtailwind.config.jsのパージ設定がうまく機能していないと思ったのですが、未だ解決には至っていません。

設定の間違い等、ご教示いただけると幸いです。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

docker-compose

docker-composeとは、複数のコンテナで構成されるサービスを提供する手順を自動的し管理を簡単にするツール。composeファイルを使用しコマンド1回で設定した全サービスを作成・起動することが可能です。

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Docker

Dockerは、Docker社が開発したオープンソースのコンテナー管理ソフトウェアの1つです