我的 Rails 应用程序有一个自定义主题。该主题由 8 个结构复杂的文件夹(子文件夹、大量文件)组成。其中一个文件夹是 bootstrap,它由 css、js 和 img 子文件夹组成。其他一些文件夹和子文件夹也包含 css、js 和图像。
如何使用资产管道预编译这些文件以及如何从代码中访问它们?
我的 Rails 应用程序有一个自定义主题。该主题由 8 个结构复杂的文件夹(子文件夹、大量文件)组成。其中一个文件夹是 bootstrap,它由 css、js 和 img 子文件夹组成。其他一些文件夹和子文件夹也包含 css、js 和图像。
如何使用资产管道预编译这些文件以及如何从代码中访问它们?
我最近购买了一个大型 HTML5 主题并执行了将其放入我的 Rails 项目并使用资产管道的工作。我必须做一些批量查找/替换才能让图像 URL 满意。这是我使用的整体方法:
使用上述方法,所有相对路径都应按照主题供应商的要求进行维护。例如,我的主题供应商将所有图像都放在一个“img”目录下,所以我只是复制了那个目录,所以它是 /vendor/assets/images/img/...
现在,我们需要获取 application.css 和 application.js 文件以正确提取所需的文件:
现在棘手的部分取决于您的 javascript 和样式表是否包含其他项目。对于任何这样做的文件,我建议您将它们重命名为 .erb(在文件名中添加 .erb),这样您就可以使用 rails 助手,例如asset_path和image_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 编译器对此作呕!
对于引导程序,我建议使用 rails bootstrap gem。如果您将其余资产放在 app/assets/{javascripts|stylesheets} 目录中,它们将被打包到一个 application.{js|css} 文件中,因为您的清单默认具有 require_tree 指令。
对于图像,只需将它们放在 app/assets/images 中,就可以像在您的公共目录中一样访问它们