Я пытаюсь использовать шаблон Wrapbootstrap в своем приложении Rails, но он не может найти свой images, поскольку он ищет в разделе welcome / build. Я считаю, что это можно решить, переместив все из раздела welcome/build/img в assets/images? Но как мне сослаться на это в моем файле index.html.erb?

Не загружаются все файлы в папке сборки:

Images not found

Файловая структура из браузера Chrome:

File system structure

Маршруты рейка:

Prefix Verb URI Pattern              Controller#Action
welcome_about GET  /welcome/about(.:format) welcome#about
welcome_index GET  /welcome/index(.:format) welcome#index

Версия Rails:

Рельсы 4.2.8

Версия Ruby:

2.5.1

Файл Index.html.erb, ссылающийся на не найденные изображения:

<div class="product col-md-3 col-sm-6 col-xs-12" data-product-id="1">
          <div class="inner-product">
            <span class="onsale new">New!</span>
            <div class="product-thumbnail">
              <img src="build/img/products/3.jpg" class="img-responsive" alt="">
            </div>
            <div class="product-details text-center">
              <div class="product-btns">
                <span data-toggle="tooltip" data-placement="top" title="Add To Cart">
                  <a href="#!" class="li-icon add-to-cart"><i class="lil-shopping_cart"></i></a>
                </span>
                <span data-toggle="tooltip" data-placement="top" title="Add to Favorites">
                  <a href="#!" class="li-icon"><i class="lil-favorite"></i></a>
                </span>
                <span data-toggle="tooltip" data-placement="top" title="View">
                  <a href="product.html" class="li-icon view-details"><i class="lil-search"></i></a>
                </span>
              </div>
            </div>
          </div>
          <h3 class="product-title"><a href="#!">Unisex Cap</a></h3>
          <div class="star-rating">
            <span style="width:65%"></span>
          </div>
          <p class="product-price">
            <ins>
              <span class="amount">$99.99</span>
            </ins>
          </p>
        </div><!-- /.product -->
0
BV45 22 Апр 2018 в 22:47

1 ответ

Лучший ответ

Посмотрите, How to Use the Asset Pipeline . Все изображения заменяются под app/assets/images, и для просмотра изображение будет

<%= image_tag "logo.svg", class: "img-responsive" %>

Такой же как

<%= image_tag("logo.svg", class: "img-responsive") %>

JavaScript: замените все файлы js на app/assets/javascripts, эти файлы будут автоматически сопоставлены из-за //= require_tree . в application.js

Таблица стилей: замените все файлы css на app/assets/stylesheets, эти файлы будут автоматически сопоставлены.

Перед тем, как начать, вы должны понять конвейер ресурсов rails, перейти по предоставленному URL-адресу и внимательно прочитать, а затем применить.

Обновить

Если ваш файл находится в глубоком каталоге вроде этого app/assets/build/img/products/product.jpg, то image_tag понравится это для показа этого изображения

<%= image_tag("build/img/products/product.jpg", class: "img-responsive") %>
#=> localhost:3000/assets/build/img/products/product.jpg

Сгенерированный HTML

<img class="img-responsive" src="/assets/build/img/products/product-005a83fc6c...xxx.jpg">
2
fool-dev 27 Апр 2018 в 12:08