Go to Qiita Advent Calendar 2024 Top
LoginSignup
uraoka_yutaro
@uraoka_yutaro (祐太朗 浦岡)

Are you sure you want to delete the question?

If your question is resolved, you may close it.

Leaving a resolved question undeleted may help others!

We hope you find it useful!

自動デプロイ後にCSSが反映されない時の対処法を実践してみたのですが、エラーが発生

Q&A

CapistranoAWSEC2

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
自動デプロイした後、Githubでmasterにアップした後、
EC2で自動デプロイするとCSSが表示されなくなった。

発生している問題・エラーメッセージ

stlye.css
@ -445,11 +445,11 @@ i {
  transition-timing-function: ease-in;
}

/* .button {
.button {
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.05) 1%, rgba(0, 0, 0, 0.2) 100%);
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.05) 1%, rgba(0, 0, 0, 0.2) 100%);
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1%, rgba(0, 0, 0, 0.2) 100%);
} */
}

ul {
  margin: 0;
@ -648,16 +648,9 @@ body {
h1,
h2,
h3,


h4,
body {
  text-align: center;
  color: #666;
  font-size: 18px;
}


h5,
h6,
body {
  line-height: 1.57;
  letter-spacing: 0.15em;
@ -665,26 +658,8 @@ body {
  color: #666;
  font-family: 'Unica One', "Avenir", "游ゴシック", "YuGothic", "ヒラギノ角ゴ Pro W6", "HIragino Kaku Gothic Pro W6", "HIragino Kaku Gothic Pro", Osaka, Meiryo, "メイリオ", "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
  margin: 0;
  text-align: center;
}

h5,
body {
  font-size: px;
  color: #666;

  margin: 0;
  text-align: center;
}


h6,
body {
  margin : 50px 100px;
  text-align: left;
}


a {
  text-decoration: none;
  color: #666;
@ -707,9 +682,9 @@ div.contents.row div.content_post p {
  font-size: 2em !important;
}

/* ::selection {
::selection {
  background: #D8D8D8;
} */
}

.transition,
a,
@ -751,7 +726,7 @@ header.header div.header__bar.row div.grid-6 a.post:hover {
}

.title--big {
  font-size: 2.5em;
  font-size: 1.5em;
  font-weight: bold;
}

@ -847,10 +822,10 @@ header.header .user_nav ul li a {
  border-bottom: 1px solid #d8d8d8;
}

/* .form {
.form {
  background: url(https://dl.dropboxusercontent.com/u/5840617/DeathtoStock_Wired3.jpg);
  background-size: cover;
} */
}

.form .contents {
  position: absolute;
@ -885,16 +860,14 @@ div.contents.row .new_user {

div.contents.row div.content_post {
  margin: 20px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
  position: relative;
  height: 400px;
  color: #fff;
  /* background-size: cover;
  background-position: center center; */
  background-size: cover;
  background-position: center center;
  border-radius: 3px;
  /* box-shadow: 0 0 10px rgba(41, 41, 41, 0.2); */
  box-shadow: 0 0 10px rgba(41, 41, 41, 0.2);
}

div.contents.row div.content_post:after {
@ -1091,17 +1064,4 @@ footer p {
  /* object-fit: contain; */
  /* background: cover; */
  max-height: 100%;
}

 .a {
  font-size: 3em;
  letter-spacing: -2px;
  margin-bottom: 30px;
  text-align: center;
}

.p{
  font-size: 1.1em;
  line-height: 1.7em;
  margin: 0 0 10px;


[ec2-user@ip-172-31-45-251 nostalgia]$ sudo less /var/log/nginx/error.log
2020/11/16 07:37:24 [error] 29011#0: *555 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/"
2020/11/16 07:37:32 [error] 29011#0: *555 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/"
2020/11/16 07:37:34 [error] 29011#0: *557 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/"
2020/11/16 07:38:09 [error] 29011#0: *555 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/"
2020/11/16 07:38:36 [error] 29011#0: *557 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/items"
2020/11/16 07:38:44 [error] 29011#0: *555 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/items"
2020/11/16 07:38:55 [error] 29011#0: *557 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css HTTP/1.1",
 host: "54.248.24.69", referrer: "http://54.248.24.69/items"
2020/11/16 07:40:11 [error] 29011#0: *584 open() "/var/www/nostalgia/public/assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css" failed (2: No su
ch file or directory), client: 103.5.140.149, server: 54.248.24.69, request: "GET /assets/application-bd27d8a19976d1f442130770741a52ef0e54af51b09d239d898a2c593a0957ab.css 

多過ぎたので残りはスクリーンショット
https://gyazo.com/abdca666a20d3bbd142b152260e832b8

該当のソースコード

[ec2-user@ip-172-31-45-251 nostalgia]$ RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D
Traceback (most recent call last):
    10: from /home/ec2-user/.rbenv/versions/2.6.5/bin/unicorn_rails:23:in `<main>'
     9: from /home/ec2-user/.rbenv/versions/2.6.5/bin/unicorn_rails:23:in `load'
     8: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/bin/unicorn_rails:209:in `<top (required)>'
     7: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/bin/unicorn_rails:209:in `new'
     6: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/http_server.rb:77:in `initialize'
     5: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/http_server.rb:77:in `new'
     4: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:77:in `initialize'
     3: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:84:in `reload'
     2: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:84:in `instance_eval'
     1: from config/unicorn.rb:8:in `reload'
/home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:592:in `working_directory': config_file=config/unicorn.rb would not be accessible in working_directory=/var/www/current (ArgumentError)
master failed to start, check stderr log for details

[ec2-user@ip-172-31-45-251 ~]$ ps aux | grep unicorn
ec2-user 26645  0.0  9.3 455140 94152 ?        Sl   07:45   0:01 unicorn master -c /var/www/nostalgia/current/config/unicorn.rb -E deployment -D
ec2-user 26696  0.0  9.0 456280 91096 ?        Sl   07:45   0:00 unicorn worker[0] -c /var/www/nostalgia/current/config/unicorn.rb -E deployment -D
ec2-user 27277  0.0  0.0 119436   964 pts/2    S+   08:10   0:00 grep --color=auto unicorn
[ec2-user@ip-172-31-45-251 ~]$ kill 26645
[ec2-user@ip-172-31-45-251 ~]$ ps aux | grep unicorn
ec2-user 27281  0.0  0.0 119436   912 pts/2    S+   08:11   0:00 grep --color=auto unicorn
[ec2-user@ip-172-31-45-251 ~]$ cd  /var/www/nostalgia
[ec2-user@ip-172-31-45-251 nostalgia]$ RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -D
Traceback (most recent
 call last):
    10: from /home/ec2-user/.rbenv/versions/2.6.5/bin/unicorn_rails:23:in `<main>'
     9: from /home/ec2-user/.rbenv/versions/2.6.5/bin/unicorn_rails:23:in `load'
     8: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/bin/unicorn_rails:209:in `<top (required)>'
     7: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/bin/unicorn_rails:209:in `new'
     6: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/http_server.rb:77:in `initialize'
     5: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/http_server.rb:77:in `new'
     4: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:77:in `initialize'
     3: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:84:in `reload'
     2: from /home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:84:in `instance_eval'
     1: from config/unicorn.rb:8:in `reload'
/home/ec2-user/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/unicorn-5.4.1/lib/unicorn/configurator.rb:592:in `working_directory': config_file=config/unicorn.rb would not be accessible in working_directory=/var/www/current (ArgumentError)
master failed to start, check stderr log for details
[ec2-user@ip-172-31-45-251 nostalgia]$ sudo less /var/log/nginx/error.log

試したこと

IPアドレスを開くとCSSが表示されず、
一度、EC2でps aux | grep unicornで立ち上がっているものをkillして、
RAILS_SERVE_STATIC_FILES=1 unicorn_rails -c config/unicorn.rb -E production -Dで立ち上げて、ローカル上でbundle exec cap production deployを行い、
再度、IPアドレスを開いたのですが、結果は変わりませんでした。

補足情報（FW/ツールのバージョンなど）

ローカル環境では問題なく、WEBサイトは起動出来ていました。

WEBサイトのスクリーンショット
https://gyazo.com/2661a271f9bd7df9941ea37f6e8b9577

0

1Answer

uasi
@uasi

エラーログを見ると nginx がアセットファイル /var/www/nostalgia/public/assets/application-...css を見つけられなくてエラーが出ていることが分かります。

最後にデプロイした Rails アプリケーションは /var/www/nostalgia/current 以下に配置されますから、アセットファイルのパスは /var/www/nostalgia/current/public/assets/application-...css になるはずです（エラーになるパスと比べて current が入っていることに注意）。

nginx が正しい場所からファイルを探すようにするには、 nginx.conf の　root ディレクティブを正しく設定します。 おそらく今は root /var/www/nostalgia/public になっているので、 root /var/www/nostalgia/current/public に直してください。

0Like

Comments

  1. @uraoka_yutaro

    Questioner

    uasiさんご回答くださりありがとうございます！！
    CSSを元の状態にcommand＋zでひたすら元に戻し続けて、
    自動デプロイするとWEBで表示されるようにはなりました。。。
    問題があるCSSのgithubのhistoryを編集して記載致します！！

  2. @uraoka_yutaro

    Questioner

    CSSは文字の位置を変えたり、バックイメージを思うように表示出来なかったものをコメントアウトしたぐらいなのですが、もしかしてコメントアウトしてはいけない部分をコメントアウトしてしまったことが原因かと思いました。。。

Your answer might help someone💌

LoginSign Up