Rails自定义主题的资产管道

时间:2012-12-27 16:01:01

标签: ruby-on-rails asset-pipeline

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

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

2 个答案:

答案 0 :(得分:4)

我最近购买了一个大型HTML5主题,并完成了将其纳入我的rails项目并使用资产管道的工作。有一些批量查找/替换我必须做的是让图片网址满意。以下是我使用的整体方法:

  1. 将所有提供的“图像”文件和目录放在下面 /供应商/资产/图像。
  2. 将所有提供的样式表放在下面     /供应商/资产/样式表
  3. 将所有提供的javascript放在     /供应商/资产/ Javascript角
  4. 通过上述方法,所有相对路径都应该按照主题供应商的要求进行维护。例如,我的主题供应商将所有图像都放在'img'目录下,所以我只是复制了该目录,因此它是/ vendor / assets / images / img /...

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

    1. 在/app/assets/javascripts/application.js中添加需要行以添加主题供应商所说的所有需要​​的javascript
    2. 在/app/assets/stylesheets/application.css中添加需要行以添加所需的所有样式表
    3. 现在棘手的部分取决于你的javascripts和样式表是否包含其他项目。对于任何已完成的文件,我建议您将它们重命名为.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编译器在喋喋不休!

答案 1 :(得分:1)

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

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