将引导模板与导轨集成？答案

【问题标题】：Integrating bootstrap template with rails?将引导模板与导轨集成？
【发布时间】：2013-08-04 15:34:13
【问题描述】：

我从 themeforest.net 购买了一个 HTML/CSS 引导模板。我正在尝试将它导入到 Rails 中，这样我就可以开始编辑它并进一步开发。我遵循了有关如何将资产（js、图像、字体和 css）添加到 rails 并从 application.html 渲染部分的所有指南.erb 但是，当我启动 rails 站点部分加载时，当我在 Chrome 中检查 Web 开发人员控制台时，它会显示 .js 文件的不同错误。这是screenshot

Uncaught TypeError: Object [object Object] has no method 'superfish' script.js?body=1:2
(anonymous function) script.js?body=1:2

jQuery.fn.extend.addEventListener jquery.ui.map.js?body=1:341
jQuery.fn.(anonymous function) jquery.ui.map.js?body=1:370
(anonymous function) sliderhome.js?body=1:15

Uncaught ReferenceError: google is not defined jquery.ui.map.js?body=1:341
jQuery.fn.extend.addEventListener jquery.ui.map.js?body=1:341
jQuery.fn.(anonymous function) jquery.ui.map.js?body=1:370
(anonymous function) sliderhome2.js?body=1:15

Uncaught ReferenceError: google is not defined jquery.ui.map.js?body=1:341
jQuery.fn.extend.addEventListener jquery.ui.map.js?body=1:341
jQuery.fn.(anonymous function) jquery.ui.map.js?body=1:370
(anonymous function) sliderhome4.js?body=1:15

Uncaught ReferenceError: google is not defined jquery.ui.map.js?body=1:341
jQuery.fn.extend.addEventListener jquery.ui.map.js?body=1:341
jQuery.fn.(anonymous function) jquery.ui.map.js?body=1:370
(anonymous function) switcher.js?body=1:18

Uncaught ReferenceError: google is not defined jquery.ui.map.js?body=1:341
jQuery.fn.extend.addEventListener jquery.ui.map.js?body=1:341
jQuery.fn.(anonymous function) jquery.ui.map.js?body=1:370
(anonymous function) contact.js?body=1:6
l jquery.js?body=1:703
c.fireWith jquery.js?body=1:747
v.extend.ready jquery.js?body=1:514
A

非常感谢有关此问题的任何帮助。在此先感谢

【问题讨论】：

您关注哪些指南？您是否使用 gem 将 Bootstrap 添加到 Rails（bootstrap-sass 或 twitter-bootstrap-rails）？通常，ThemeForest 主题包括 Bootstrap 作为 CSS 和 JS 的一部分，并带有额外的自定义，旨在进入 public/ 目录。这使得与 Rails 资产管道集成变得困难。
丹尼尔，感谢您的回答。我正在使用 gem 'bootstrap-sass'，'2.1'。对于指南，谷歌搜索并找到了处理资产管道的方法。我一直在使用其他一些带有较少 jQuery 的引导模板，它们都工作得很好，但是我需要的这个不会。困难是指完全不可能吗？
application.js中可能有js排序问题
我得到 jarvismenu is not defined -- 错误。但是 jarvismenu 是在同一个 js 文件中定义的，例如： $.fn.extend({ jarvismenu : function(options) { ... }; }); .不知道我错过了什么:(

标签： ruby-on-rails ruby-on-rails-3 twitter-bootstrap twitter-bootstrap-rails

【解决方案1】：

对于从 themeforest 进行主题集成 .. 而不是删除 gem 并将 bootstarp css 文件包含在 assets/css 文件夹中，您还可以通过这种方式添加自定义 css，根据您的屏幕截图，您的 js 排序似乎产生了一些问题，因此请查看在 application.js 中为您的 js 包括 ...

【讨论】：

//= 需要 jquery //= 需要 jquery_ujs //= 需要 jquery-fileupload //= 需要引导程序 //= require_tree 。我已经将它包含在 application.js 中