Sinatra CSS /图像问题

Question

我有一个本地运行的sinatra应用程序,但是当我去添加样式时,我遇到了一个问题.我放置了CSS文件,public/css/style.css但没有提供.经过一些故障排除后我发现了Rack::Static中间件并解决了当时的问题,我添加的行config.ru是:

use Rack::Static, :urls => ["/css", "/images"], :root => "public"

这让Rack 分别从public/css和提供css和图像public/images.当您在Haml中链接图像或样式时,您只需使用css/style.css并关闭公众.

我昨晚之后遇到的问题是,我在views目录中创建了一个小文件结构,以便更好地组织内容,所以现在当你访问/ contact/new路径时,它会使views/contacts/_form.hamlCSS无效.在页面上查看源确认Rack正在尝试提供CSS contacts/css/style.css而不是css/style.css正确显示主索引的正确路径.

我如何解决这个问题,以确保它始终从URL的根目录呈现,而不是基于当前正在呈现的视图的相对位置？我尝试过root => "#{File.dirname(__FILE__)/public",config.ru但没有帮助.

Answer 1

我认为视图模板的位置不应该有任何区别,但是如果你有相对的URL,css/style.css那么浏览器会将它附加到托管它的页面的URL的路径部分.因此,如果页面URL是contact/new有效的URL成为contact/css/style.css.

如果您在相对URL前面加上'/',/css/style.css则它应该相对于您映射到公共目录的站点的根路径.这可能是最好的方式:

  %link{ :href => '/css/style.css', :rel => 'stylesheet', :type => 'text/css' }

我没有尝试使用rackup文件来配置静态文件.这对应用程序本身有用:

  set :static, true
  set :root, File.dirname(__FILE__)
  set :public, 'public'

但我认为Sinatra默认会提供公开的静态文件,所以我认为最后一行不是必需的.