Question

我正在使用Heroku - Yeoman - AngularJS Full-Stack - Bootstrap - NodeJS Stack。

Heroku上的部署是使用＆＃39; Grunt build＆＃39;命令。当部署到Heroku时，我在网页上渲染CSS图像时遇到问题。显示页面中的任何图像，但不显示CSS文件。

例如：以下代码不起作用

CSS

function associate_errors(errors, $form) {
    //remove existing error classes and error messages from form groups
    $form.find('.form-group').removeClass('has-errors').find('.help-text').text('');
    errors.foreach(function (value, index) {
        //find each form group, which is given a unique id based on the form field's name
        var $group = $form.find('#' + index + '-group');

        //add the error class and set the error text
        $group.addClass('has-errors').find('.help-text').text(value);
    });
}

HTML：

.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;
}

在本地运行<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>时工作正常但是只要它在Heroku上部署，CSS图像就会丢失。

Answer 1

根据评论中的建议，链接应为：

/assets/images/image.jpg

而不是：

../assets/images/image.jpg

在Heroku上没有与AngularJS一起显示的CSS图像

CSS

HTML：

1 个答案: