4

我的 Rails 应用程序有一个自定义主题。该主题由 8 个结构复杂的文件夹(子文件夹、大量文件)组成。其中一个文件夹是 bootstrap,它由 css、js 和 img 子文件夹组成。其他一些文件夹和子文件夹也包含 css、js 和图像。

如何使用资产管道预编译这些文件以及如何从代码中访问它们?

4

2 回答 2

4

我最近购买了一个大型 HTML5 主题并执行了将其放入我的 Rails 项目并使用资产管道的工作。我必须做一些批量查找/替换才能让图像 URL 满意。这是我使用的整体方法:

  1. 将所有提供的“图像”文件和目录放在 /vendor/assets/images 下。
  2. 将所有提供的样式表放在 /vendor/assets/stylesheets 下
  3. 将所有提供的 javascript 放在 /vendor/assets/javascripts 下

使用上述方法,所有相对路径都应按照主题供应商的要求进行维护。例如,我的主题供应商将所有图像都放在一个“img”目录下,所以我只是复制了那个目录,所以它是 /vendor/assets/images/img/...

现在,我们需要获取 application.css 和 application.js 文件以正确提取所需的文件:

  1. 在 /app/assets/javascripts/application.js 添加要求行以添加您的主题供应商说您需要的所有 javascript
  2. 在 /app/assets/stylesheets/application.css 添加要求行以添加所需的所有样式表

现在棘手的部分取决于您的 javascript 和样式表是否包含其他项目。对于任何这样做的文件,我建议您将它们重命名为 .erb(在文件名中添加 .erb),这样您就可以使用 rails 助手,例如asset_pathimage_path

.i24_arrow-180{ background-image: url(<%= asset_path 'img/icons/packs/fugue/24x24/arrow-180.png' %>); }

或者,在您的 javascript 中:

'<%= asset_path('js/mylibs/charts/jquery.flot.orderBars') %>':

一旦您修复了任何图像路径,您应该准备好使用新主题,并且它将与资产管道一起使用!

警告:我花了几个小时调试一个带有主题的资产编译问题,结果发现这是因为其中一张图片的文件名中有一个括号,而 sass 编译器对此作呕!

于 2013-01-14T17:19:19.587 回答
1

对于引导程序,我建议使用 rails bootstrap gem。如果您将其余资产放在 app/assets/{javascripts|stylesheets} 目录中,它们将被打包到一个 application.{js|css} 文件中,因为您的清单默认具有 require_tree 指令。

对于图像,只需将它们放在 app/assets/images 中,就可以像在您的公共目录中一样访问它们

于 2012-12-27T16:30:49.730 回答