1

Heroku - Yeoman - AngularJS Full-Stack - Bootstrap - NodeJS Stack を使用しています。

Heroku 上のデプロイメントは、'Grunt build' コマンドを使用してビルドされます。Heroku にデプロイすると、Web ページで CSS 画像をレンダリングする際に問題が発生します。ページ内の画像は表示されますが、CSS ファイルからのものは表示されません。

例: 以下のコードは機能しません

CSS

.aboutpage-header
{
    height: 250px;
    background: url('../images/slider-map.jpg') center center no-repeat scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    padding-top: 50px;
}

HTML:

<header class="aboutpage-header">
  <div class="container text-center">
    <div class="row">
      <div class="col-lg-12">
        <h2 class="title">About Us</h2>
        <h2 class="intro"><i class="fa fa-location-arrow"></i>Company<span class="highlight">IT</span>
          are experts in bespoke software development and tailored consulting</h2>
      </div>
    </div>
  </div>
</header>

ローカルでは実行時に問題なく動作しますGrunt serveが、Heroku にデプロイするとすぐに CSS イメージが失われます。

4

1 に答える 1