пытаюсь, чтобы изображение png отображалось в моем приложении Ruby

Question

Я пытаюсь заставить изображение появиться, но оно просто не работает. Имейте в виду, это мое самое первое приложение Ruby (самопрограммируемый продукт), и я клонировал Repo, поэтому заранее приношу свои извинения, если я не предоставляю всю необходимую информацию из get- go или пропускаю довольно простой надзор

Вот мой скриншот моего изображения, не отображаемого:

Я создал графику c в Illustrator и экспортировал ее. png. Затем я добавил его в нужную папку проекта. Изображение называется AIQtshirt.png и вот фрагмент кода:

 {
  'count' => 15,
  'html' => 'AutonomIQ<br>T-shirt',
  'class' => 'three',
  'image' => ActionController::Base.helpers.asset_path(
    'refer/AIQtshirt.png') 
  }

На самом деле, когда я использую изображение, которое было там раньше (из клонированного репо), оно работает. Это изображение называется truman.png, и оно находится в той же папке, в которую я поместил файл AIQtshirt.png:

Вот фрагмент кода из использования Первоначальный заполнитель, который был в репо, когда я его клонировал:

{
  'count' => 15,
  'html' => 'AutonomIQ<br>T-shirt',
  'class' => 'three',
  'image' => ActionController::Base.helpers.asset_path(
    'refer/truman.png')
}

Если проще посмотреть репо, на него можно ссылаться здесь. https://github.com/harrystech/prelaunchr

Я могу представить, что я забываю сделать что-то в другой папке репо.

Вот строка, которую я получил, когда редактировал репо с помощью код, указанный в комментариях:

Заранее спасибо за помощь!

Обновление: Вот код:

<% stops.each do |stop| %>
    <li class="product brandon <% if stop["selected"] %>selected<% end %> <% if stop["class"] == 'five' %>last<% end %>">
      <div class="circle"><%= stop["count"] %></div>
      <div class="sep"></div>
      <p><%= stop["html"].html_safe %></p>

      <div class="tooltip">
         <img src="<%= stop["image"] %>" height="254">
      </div>

Answer 1

Как отлаживать

Один из способов отладки - отредактировать app/views/users/refer.html.erb, чтобы отобразить URL-адрес изображения на вашей странице. Вы должны найти этот фрагмент (при условии, что он относится к изображению, которое вы не можете видеть):

<div class="tooltip">
  <img src="<%= stop["image"] %>" height="254">
</div>

и заменить его на что-то вроде этого:

<div class="tooltip">
  My img url as seen by rails is: <%= stop["image"] %> 
  <br/> Hm, is this where my image is? Have I made a typo? :)
  <img src="<%= stop["image"] %>" height="254">
</div>

Что сработало

Поскольку я не хотел, чтобы это зависание оставалось без ответа, я сам клонировал приложение pre-launcher и смог отобразить изображение. Итак, я предполагаю, что вы используете свой dev-сервер, используя foreman start -f Procfile.dev, и что все из файла README из репозитория pre-launcher прошло хорошо для вас (например, rake db: create, rake db: migrate)

Итак, вот что я сделал. Я взял случайную фотографию бритвы из inte rnet, назвал ее fancy-shaver.png и сохранил в папке: app/assets/images/refer.

Затем я отредактировал app/models/user.rb (только первый реферальный шаг) и поместил это :

 REFERRAL_STEPS = [
    {
      'count' => 5,
      'html' => 'Fancy shaver',
      'class' => 'two',
      'image' =>  ActionController::Base.helpers.asset_path(
        'refer/fancy-shaver.png') # <- this is what I changed
    },
    {
      'count' => 10,
      'html' => 'Truman Handle<br>w/ Blade',
      'class' => 'three',
      'image' => ActionController::Base.helpers.asset_path(
        'refer/truman@2x.png')
    },
    # ... the rest I didn't touch

Затем я открыл, http://localhost:5000/refer-a-friend, и, как и вы, я почувствовал, что изображение пропало. Затем я просто сделал: CTRL+C там, где работал мой сервер, и запустил его снова. Изображение было видно после этого. И вот что я получил:

Если это не работает до сих пор

Совет : когда дела идут go на юг, особенно при изучении чего-то нового, иногда лучше всего перезапустить все (клонировать приложение в новой папке) и выполнить все шаги, которые сработали (например, вы можете попробовать то, что я сделал после того, как следил за приложением readme).