如何在 Rails 中显示来自多个目录的图像

Question

我正尝试在我的 Rails 应用程序中使用 Wrapbootstrap 模板，但它无法找到我的 images，因为它正在 welcome/build 下查找。我相信可以通过将 welcome/build/img 下的所有内容移到 assets/images 下来解决这个问题？但是我如何在我的 index.html.erb 文件中引用它？

构建文件夹下的所有文件都没有被拾取：

来自 Chrome 浏览器的文件结构：

佣金路线：

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

Rails版本：

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</span>
            </ins>
          </p>
        </div><!-- /.product -->

Answer 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">

如何在 Rails 中显示来自多个目录的图像

How to show images from multiple directories in Rails

ruby-on-rails

twitter-bootstrap

ruby-on-rails-4