Ruby on Rails-在我的应用程序中包含多个js库文件的最佳方式

时间:2017-12-30 11:33:15

标签: ruby-on-rails

我正在构建一个Rails应用程序,我希望为我的前端包含Pages库。该库包含多个js文件,看起来我需要所有这些文件(有超过30个.js文件)。

我可以将它们包含在application.js文件中的最佳方法是什么?从它的外观来看,我的选择是:

  1. 从每个文件中复制代码并将其粘贴到application.js按订单生成(原因与//=require_tree interprets each file in alphabetical order //=require_tree <nav class = "navbar navbar-inverse navbar-fixed-top" role = "navigation"> <div class = "container"> <div class = "navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class = "icon-bar"></span> <span class = "icon-bar"></span> <span class = "icon-bar"></span> </button> <a class = "navbar-brand" href = "index.html">WM</a> </div> <div class = "collapse navbar-collapse" id = "myNavbar"> <ul class = "nav navbar-nav navbar-right"> <li><a href = "https://github.com/williamjmiller" target="_blank">Projects</a></li> <li><a href = "documents/myresume.pdf" target = "_blank">Resume</a></li> <li><a href = "#bottom">Contact Me</a></li> <input type = "button" class="btn btn-info navbar-btn" value = "Blog" onclick = "relocate_blog()" id = "blog-button"> <script> function relocate_blog() { location.href = "blog.html "; } </script> </ul> </div> </div><!--End Container --> </nav><!-- End Navbar --> 相同。建议不要这样做,如文件本身所示。
  2. 单独重命名每个文件,以便订单按字母顺序排列,.htaccess按字母顺序收集它们(非常麻烦!)
  3. 我确信必须有更好的方法,因为我不是第一个想在我的项目中加入大型图书馆的人。我应该遵循什么方法?

2 个答案:

答案 0 :(得分:1)


   我认为没有什么比最好的方法更好了,但我最终采用了一种非常好的方法来管理铁路资产,落后于性能。除非您的应用只有少量资产可供支付,否则请勿使用 require_tree

每个模板都有两组资产。一个是 核心资产 ,应该在整个应用程序中需要,例如 bootstrap ,另一个是 页面特定资产 仅适用于画廊页面的 jquery lightbox 。  在应用程序js中添加所有资产使得它们可以在所有页面上加载,但rails拥有干净的解决方案来处理这个问题。

1。首先将所有资源复制到vendor/assets/javscriptsvendor/assets/stylesheets文件夹。如果您使用 rails 5.1 + ,则会从供应商中删除assets文件夹,如果您希望使用旧的约定,则可以创建 assets/javascripts 和{{1文件夹并将它们添加到assets/stylesheet或5.1+中的预编译中。我更喜欢将模板的资源文件夹中的所有内容复制到供应商文件夹。这取决于你。

2。config/initializers/assets.rbcore assets中加入您的所有application.js。最好将application.css中的javascript_include_tag从标题移到application.html.erb标记的正上方。如果要在视图文件中编写jquery,可能需要在标题中单独保留</body>

3.要添加特定于页面的js,请创建具有控制器名称的js文件。即,对于jquery,在app / assets / javascripts中创建homes_controller。然后更换。

homes.js
带有

的application.html.erb中的

<%= javascript_include_tag 'application'%>

这将加载具有控制器名称的js以及应用程序js。您可以为此控制器<%= javascript_include_tag 'application', params[:controller] %> 资产,或者在此文件中单独为此控制器视图编写js。为此,您需要将此文件添加到assets.rb中的预编译中。而不是添加单个文件,只需//require到assets.rb,它将预编译所有资产 希望这会有所帮助。

答案 1 :(得分:0)

我认为你可以按照简单的步骤进行操作,因为这是下面的简单方法。

第1步。您可以在assets/javascripts内创建一个文件夹,它看起来像assetes/javascripts/modules或者您真正喜欢的任何内容,而不是modules所有JS文件上传到新创建的文件夹。

第2步。然后application.js只包括像//= require modules/file_name这样的文件包含所有类似的文件

那就是它,我认为这很容易。

  

注意:您还可以上传rails_project/vendor/assets/javascripts/

中的所有文件

希望能提供帮助