html - 将样式表传递给 heroku

标签 html css ruby-on-rails twitter-bootstrap heroku

我有一个要推送到 heroku 的本地应用程序,几个小时前它停止工作了。

Heroku 停止识别 Bootstrap ,我的本地主机和 heroku 都停止识别我的 css 文件。真正让我感到困惑的是,3 小时前,heroku 和我的本地主机都运行良好。

我将我的代码回滚到我知道它工作的最后一次,但我的 application.css 文件仍然没有被确认,即使我知道它是完全相同的代码!

我在网上找不到任何关于我的问题的 heroku 支持的任何答案,因此非常感谢任何帮助。

我的所有 HTML 文件(只有 heroku 无法识别的部分):

<!DOCTYPE html>
<html>
<head><br><br>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Appv013</title>
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <link rel="stylesheet" href="application.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>

<nav class="navbar navbar-inverse navbar-fixed-top ">
  <div class="container-fluid">
  <div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>                        
  </button>
  <%= link_to 'Home', root_path, class: 'navbar-brand' %>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li class="dropdown">
      <li><a href="#">Page 1</a></li>
      <!-- NOTES!!!  REPLACE ABOVE LINE AND
      USE BELOW FOR DROP DOWN THING

      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1 <span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li><a href="#">Page 1-1</a></li>
        <li><a href="#">Page 1-2</a></li>
        <li><a href="#">Page 1-3</a></li>
      </ul> -->
    </li>
    <li><a href="#">Page 2</a></li>
    <li><a href="#">Page 3</a></li>
  </ul>

  </ul>
</div>

<%= yield %>
 test 0.13.97
 </body>
 </html>

还有我的整个 CSS appliation.css 文件(都没有识别的部分):

body{
  margin-right: 10px;
  margin-left: 10px;
  background-color: #eee;
}
.navbar-inverse {
  background-color: #000000;
  border-color: #BFFFEA;
}

编辑:我正在为 git 使用 heroku,下面是我运行本地服务器时终端的输出

Started GET "/" for ::1 at 2015-08-04 15:26:39 -0400
Processing by VisitorsController#index as HTML
  (1.0ms)  SELECT COUNT(*) FROM "users"
Rendered visitors/index.html.erb within layouts/application (2.1ms)
Completed 200 OK in 7ms (Views: 5.6ms | ActiveRecord: 1.0ms
Started GET "/application.css" for ::1 at 2015-08-04 15:26:39 -0400
ActionController::RoutingError (No route matches [GET] "/application.css"):
actionpack (4.2.3) lib/action_dispatch/middleware/debug_exceptions.rb:21:in `call'
web-console (2.2.1) lib/web_console/middleware.rb:39:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/show_exceptions.rb:30:in `call'
railties (4.2.3) lib/rails/rack/logger.rb:38:in `call_app'
railties (4.2.3) lib/rails/rack/logger.rb:20:in `block in call'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:68:in `block in tagged'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:26:in `tagged'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:68:in `tagged'
railties (4.2.3) lib/rails/rack/logger.rb:20:in `call'
quiet_assets (1.1.0) lib/quiet_assets.rb:27:in `call_with_quiet_assets'
actionpack (4.2.3) lib/action_dispatch/middleware/request_id.rb:21:in `call'
rack (1.6.4) lib/rack/methodoverride.rb:22:in `call'
rack (1.6.4) lib/rack/runtime.rb:18:in `call'
activesupport (4.2.3) lib/active_support/cache/strategy/local_cache_middleware.rb:28:in `call'
rack (1.6.4) lib/rack/lock.rb:17:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/static.rb:116:in `call'
rack (1.6.4) lib/rack/sendfile.rb:113:in `call'
railties (4.2.3) lib/rails/engine.rb:518:in `call'
railties (4.2.3) lib/rails/application.rb:165:in `call'
rack (1.6.4) lib/rack/lock.rb:17:in `call'
rack (1.6.4) lib/rack/content_length.rb:15:in `call'
rack (1.6.4) lib/rack/handler/webrick.rb:88:in `service'
/Users/Anna/.rvm/rubies/ruby-2.2.1/lib/ruby/2.2.0/webrick/httpserver.rb:138:in `service'
/Users/Anna/.rvm/rubies/ruby-2.2.1/lib/ruby/2.2.0/webrick/httpserver.rb:94:in `run'
/Users/Anna/.rvm/rubies/ruby-2.2.1/lib/ruby/2.2.0/webrick/server.rb:294:in `block in start_thread'

最佳答案

听起来您的 CSS 文件的 URI 很无聊。

如果您可以包含您尝试提供的整个 HTML 页面以及针对 css 请求的开发工具输出,那么调试正在发生的事情会更容易。

我怀疑发生的情况是您的 application.css 路径错误,或者您的 Web 服务器未配置为从 css 文件所在的位置提供静态文件,或两者兼而有之。

您使用的是版本控制系统(如 git)吗?如果是这样,你有这个页面的工作版本的提交吗,你能看到 git diff 的区别吗?

如果感觉太冗长,我深表歉意,远程调试很棘手。不过,我们会得到它的!

编辑:

根据您发布的终端输出,即来自您本地运行的网络服务器的日志,您的 application.css 的 GET 请求失败。

Started GET "/application.css" for ::1 at 2015-08-04 15:26:39 -0400
ActionController::RoutingError (No route matches [GET] "/application.css"):

不幸的是,Ruby 不是我的领域,但我可以尝试提供一般性建议。

您面临的问题被称为提供静态文件(这是解决您问题的好谷歌食品),并且根据您应用程序的配置,解决方案会有所不同。一个值得一读的答案是 here ,也许 this会有所帮助。基本上,有一个文件夹包含您的 css 文件(我猜它被称为“公共(public)”),您需要公开该目录中的文件,以便您的网络服务器将在您包含在 html 文件中的 URL 上提供它们。您可以在本地使用终端输出来查看错误的详细信息,或者当事情被推送到 heroku 时,您可以使用 chrome 开发工具来获取有关请求/响应的详细信息。您需要这些静态请求返回 200、304 或其他一些“这里有一些数据”响应代码。

在修复本地错误之前,您不需要这个技巧,但是在 heroku 上进行生产调试时,一个有用的工具是 heroku run bash。这将让您通过 SSH 连接到运行您在 heroku 上部署的东西的 dyno,这在您需要诊断那里缺少的东西时很有用(例如)。

更一般地说,您似乎才刚刚开始进入 Web 开发的美妙世界。这真的很好,因为 webdev super 有趣!不过,我个人认为 Ruby 并不是最友好的入门语言;它有很多内在的“魔力”,并且对您以“正确的方式”做事并不太固执己见。相比之下,我在学习的时候发现 Python + Django 是一个绝妙的组合; Python (+ Django) 使以正确的方式做事变得容易,并使您以错误的方式做事,因此更容易保持正轨。这也有助于 Django 拥有令人惊叹的文档。 YMMV,但当我和你一样时,这个建议对我来说很重要。

关于html - 将样式表传递给 heroku,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31734615/

相关文章:

html - 如何选择滚动条并更改CSS?

javascript - 使用未选择/复制的行号生成代码

html - 激活响应菜单时隐藏div?

python - 如何链接到 django 上的用户个人资料

html - 如何在 div 中水平居中放置 2 个按钮?

css - 为什么许多小方形 div 呈现不同?

ruby-on-rails - Rails 缓存,继续存储过期值

ruby-on-rails - Bundler.require 不适用于我的 gem 中的 ActiveRecord

ruby-on-rails - Rails 4、Paperclip、Amazon S3 - 上传到特定文件夹

javascript - 使用同一插件的多个实例