新手问题 Rails 3.2.3 CSS JS 加载问题

lamp · 2012年12月05日 · 最后由 Martin91 回复于 2012年12月20日 · 9698 次阅读

最近在看 ruby on rails 第四版,也参照书中项目在写,可是在加载 css,js 文件出现了错误,我的 application.html.erb 内容如下:

<!DOCTYPE html>
<html>
<head>
  <title>Pragprog Books Online Store</title>
  <!--<%= stylesheet_link_tag    "scaffold" %>
  <%= stylesheet_link_tag    "depot", :media => "all" %>
  <%= javascript_include_tag :defaults %>
  <%= stylesheet_link_tag    "depot", :media => "all" %>-->
  <%= csrf_meta_tags %>
</head>
<body id="store">
    <div id="spanner">
        <!--<%= image_tag("/images/rails.png")%>-->
        <%= @page_title || "Pragmatic Bookshelf"%>
    </div>

    <div id="columns">
        <div id="side">
            <a href="#">Home</a>
            <a href="#">Question</a>
            <a href="#">News</a>
            <a href="#">Contract</a>
        </div>
        <div id="main">
            <%= yield %>
        </div>
    </div>

</body>
</html>

当我通过 <%= stylesheet_link_tag "depot", :media => "all" %> <%= javascript_include_tag :defaults %> 加载 css 文件时候就报错,此时我的 depot.css 文件是置于 app\assets\stylesheets 路径下,然后我自己也在 public 路径下新建了 stylesheets 目录并将 depot.css 文件放到了该目录下但是不生效,请了解这块加载的麻烦解答,多谢!

好像是一个 pipeline 的特性,昨天一个帖子刚看到,我觉得挺方便的。有什么需求需要自己创建目录么

好像是一个 pipeline 的特性,昨天一个帖子刚看到,我觉得挺方便的。有什么需求需要自己创建目录么

开发环境还是生产环境。

生成的页面源码中 css 和 js 的路径贴上来

<%= stylesheet_link_tag "depot", :media => "all" %>
<%= csrf_meta_tags %>

只保留上面的两行看看。 如果是 production 环境,需要执行 rake asserts:precompile

你看的那个书的版本是不是中文版的?如果是的话,书里的内容已经是 rails3.0.x 版本的,太旧了。 3.1 以后的版本引入了一个叫 Asset Pipeline 的概念,解释见下文: http://guides.rubyonrails.org/asset_pipeline.html 默认加载的 js 和 css 文件是:

<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "application" %>

如果需要改文件名的名字需要到config/environments/production.rb修改,改成如下:

config.assets.precompile += ['defaults.js', 'depot.css']

看我上面的那个链接,讲的很清楚的了。如果还不懂,建议看最新版的"Agile_Web_Development_with_Rails_4th_for_Rails_3.2".

#5 楼 @woaigithub 您说的那种我试过了还是不行,我的是开发环境

#6 楼 @JeskTop 我看的是英文版的,rails 版本用的是 rails3.2.3,我现在是在开发环境下,您说的那个 Asset Pipeline 能稍微解释下吗?刚刚我看了那个链接看的不是很懂

#6 楼 @JeskTop 由于 Rails 3.2 中使用了 Asset Pipeline,导致引用 CSS 的位置不是原来的 public/stylesheets 而是 app/assets/stylesheets,当我将js,css的引入改为如下<%= stylesheet_link_tag "scaffold" %> <%= stylesheet_link_tag "application", :media => "all" %> <%= javascript_include_tag "application" %>的时候就成功了,但是对这里我还是不太理解麻烦您给我说说,多谢了

#2 楼 @windlx 您能不能给我讲讲 pipeline 它底层是具体怎么处理的

#9 楼 @lamp 就是默认下 rails 只都去 application 这个名字的 js 和 css 的,就算你直接用<%= stylesheet_link_tag "scaffold" %>在开发模式下可行,生产模式下也是不可行的。因为用生产模式的时候,他会把所有的 js 或者 css 文件压缩到 application 这个 js 和 css 文件里,原因是 application 里面有一句:

//= require_tree .  //js
 *= require_tree .  //css

所以你如果想要引入别的名字需要我在上面说的那样config/environments/production.rb修改里面的东西。 如果你在里面添加了 scaffold.js,那他压缩的时候会把这个 js 文件也一同压缩,其实也就是在压缩的同时会把文件复制到 public 目录下。 压缩命令:

rake asserts:precompile
匿名 #12 2012年12月20日

中文版害苦了我,看了半天,感觉和开发环境很大区别。看最新 3.2 的版本,做法就不一样了。啃爹的中文版。

我昨天也遇到类似的问题,用@JeskTop 说的方法解决了,不过今天写了新的东西,所以又有新的问题了,看来真得仔细读一下 guides 了。

@xds2000 谢谢了啊!

需要 登录 后方可回复, 如果你还没有账号请 注册新账号