我是新來的鐵軌和我遵循邁克爾哈特爾的例子。我在第5章有一個問題(https://www.railstutorial.org/book/filling_in_the_layout)。我遵循michaels指令,但我沒有看到圖像,我的css不顯示。 我使用紅寶石的Rails 5.0.1與紅寶石2.3.3p222(2016年11月21日修訂56859)I386-的mingw32]導軌資產管道圖像和css不顯示
我加入邁克爾HTML /代碼到我的home.html.erb
<% provide(:title, "Home") %>
<div class="center jumbotron">
<h1>Welcome to the Sample App</h1>
<h2>
This is the home page for the
<a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
sample application.
</h2>
<%= link_to "Sign up now!", '#', class: "btn btn-lg btn-primary" %>
</div>
<%= link_to image_tag("rails.png", alt: "Rails logo"),
'http://rubyonrails.org/' %>
<br/><br/>
<%= link_to image_tag("bunratty.png", alt: "Bunratty"),
'http://rubyonrails.org/' %>
<%= link_to image_tag("kitten.png", alt: "Kitten"),
'http://rubyonrails.org/' %>
<%= image_tag image_url('rails.png') %>
<%= image_tag image_path('rails.png') %>
Display using html
<img src="/public/rails.png" alt="rails logo"/>
我將rails.png圖像複製到app/assets/images /目錄中,但是當我運行應用程序時,圖像不顯示,只顯示alt標記。
我還根據說明添加了bootstrap,它也不工作。
Gemfile中提取 源 'https://rubygems.org'
gem 'rails', '5.0.1'
gem 'bootstrap-sass', '3.3.6'
我跑捆綁安裝,並可以使用捆綁秀 $包展由束包括 寶石看到它被安裝: * actioncable( (5.0.1) * actionmailer(5.0.1) * actionpack(5.0.1) * actionview(5.0.1) * activejob(5.0.1) * activemo德爾(5.0.1) * ActiveRecord的(5.0.1) *的ActiveSupport(5.0.1) * ANSI(1.5.0) * AREL(7.1.4) * autoprefixer護欄(6.7.5) * bootstrap-sass(3.3.6) * builder(3.2.3) * bundler(1.13.7) * coderay(1.1.1) * coffee-rails(4.2.1) * coffee-script(2.4。 1) *咖啡腳本源(1.12.2) *併發紅寶石(1.0.4) * debug_inspector(0.0.2) * erubis(2.7.0) * execjs(2.7.0) * ffi(1.9.17) * formatador(0.2.5)(1.2.4) * guard-minitest(2.4.4) * i18n(0.8.0) * jbuilder(2.4。 1) * jQuery的導軌(4.1.1) *聽(3.0.8) *絲瓜(2.0.3) *樵夫(1.0.11) *郵件(2.6.4) * method_source(0.8。 2) * MIME類型(3.1) * MIME類型數據(3.2016.0521) * mini_portile2(2.1.0) * MINITEST(5.10.1) * MINITEST-記者(1.1.9) * multi_json(1.12.1) * nenv(0.3.0) * nio4r(1.2.1) *引入nokogiri(1.7.0.1) * notiffany(0.1.1) * PG(0.18.4) 撬*(0.10.4) * PUMA(3.4.0) * rack(2.0.1) * rack-test(0.6.3) * rails(5.0.1) * rails-controller-testing(0.1.1) * rails-dom-testing(2.0.2) * rails-html-sanitizer(1.0.3) * railties(5.0.1) * rake(12.0.0) * rb-fsevent(0.9。8) * RB-inotify的(0.9.8) *紅寶石進度(1.8.1) * SASS(3.4.23) * SASS-導軌(5.0.6) * shellany(0.0.1) * (3.6.0) * spring(1.7.2) * spring-watcher-listen(2.0.0) *鏈輪(3.7.1) *鏈輪導軌(3.2.0) * sqlite3(1.3。 12) *托爾(0.19.4) * thread_safe(0.3.5) *傾斜(2.0.6) * turbolinks(5.0.1) * turbolinks源(5.0.0) * tzinfo(1.2。 2) * tzinfo-data(1.2016.10) * uglifier (3.0.0) * Web的控制檯(3.1.1) * WebSocket的驅動程序(0.6.5) *的WebSocket的擴展(0.1.2)
我添加了一個custom.scss文件應用程序\ \資產樣式
@import "bootstrap-sprockets";
@import "bootstrap";
/* universal */
body {
padding-top: 60px;
background-color:lime;
}
section {
overflow: auto;
}
textarea {
resize: vertical;
}
.center {
text-align: center;
}
.center h1 {
margin-bottom: 10px;
}
這是因爲無論是CSS或圖像顯示資產管道問題。 我試圖將圖像放在公共目錄,公共/圖像目錄,應用程序/資產目錄,但它不顯示在任何這些。 我已經嘗試使用不同的圖像incase圖像已損壞 我曾嘗試使用創建一個新項目
任何幫助將不勝感激。
謝謝你回來給我。根據要求一些額外的信息:
我沒有一個application.scss文件,只是有以下內容的application.css文件:
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
* compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
* files in this directory. Styles in this file should be added after the last require_* statement.
* It is generally better to create a new file per style scope.
*
*= require_tree .
*= require_self
*/
的HTML生成如下:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" media="all" href="/stylesheets/default.css" data-turbolinks-track="reload" />
<script src="/javascripts/default.js" data-turbolinks-track="reload"></script>
<title>Home | Ruby on Rails Tutorial</title>
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="SogDGi5kvIl13JKu57VqH0phQ/1pSw+tKuVAmvTVuQITclDhVvKLJNwHJJzcOa0qUlOhJ8cmRsBx9rUCINA+TQ==" />
</head>
<body>
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<a id="logo" href="#">sample app</a>
<nav>
<ul class="nav navbar-nav navbar-right">
<li><a href="/">Home</a></li>
<li><a href="/help">Help</a></li>
<li><a href="/about">About Us</a></li>
</ul>
</nav>
</div>
</header>
<div class="container">
<div class="center jumbotron">
<h1>Welcome to the Sample App</h1>
<h2>
This is the home page for the
<a href="http://www.railstutorial.org/">Ruby on Rails Tutorial</a>
sample application.
</h2>
<a class="btn btn-lg btn-primary" href="#">Sign up now!</a>
</div>
<a href="http://rubyonrails.org/"><img alt="Rails logo" src="/images/rails.png" /></a>
<br/><br/>
<a href="http://rubyonrails.org/"><img alt="Bunratty" src="/images/bunratty.png" /></a>
<a href="http://rubyonrails.org/"><img alt="Kitten" src="/images/kitten.png" /></a>
<img src="http://localhost:3000/images/rails.png" alt="Rails" />
<img src="/images/rails.png" alt="Rails" />
Display using html
<img src="/public/rails.png" alt="rails logo"/>
<img src="/public/rails.png" alt="rails logo"/>
<img src="http://localhost:3000/public/rails.png" alt="rails logo"/>
<br/>
http://localhost:3000/images/rails.png
</div>
</body>
</html>
在瀏覽器中訪問localhost:3000/assets/rails.png會導致以下錯誤。
無路由匹配[GET] 「/assets/rails.png」 Rails.root:C:/軌道/ static_app
裏面什麼的圖像生成的HTML?你有沒有改變在development.rb或application.rb中的任何東西? – Iceman
你可以在你的文章中加入'app/assets/stylesheets/application.scss'嗎? –
此外,把你的圖像內'應用程序/資產/圖像',並嘗試在您的瀏覽器'http:// localhost:3000/assets/rails.png'訪問此網址 –