如何为Rails 5.1中的每个视图提供特定的JS和CSS文件

时间:2017-10-27 13:58:37

标签: javascript css asset-pipeline ruby-on-rails-5.1

我一直在使用Rails 3.2进行项目。我现在正在使用Rails 5.1构建一个新项目。我使用M& Rails的C部分广泛且几乎是View的ZERO。这是因为我使用来自第三方供应商的JavaScript UI库 - DHTMLX。

他们有各种UI组件,并提供了特定于每个组件的JS和CSS文件。

取决于我在特定视图中使用的组件'我想在我的代码中只包含相关的JS和CSS文件。保持Rails约定我有一个子文件夹与视图文件夹下的每个控制器同名,然后在每个子文件夹中我有.erb文件,其名称与控制器中的方法名称匹配。

然而,我的.erb文件几乎完全包含DHTMLX&提供的JS和CSS文件的链接。我编写的任何JavaScript函数都可以使视图工作。下面是我的start / index.erb文件的示例:

<% content_for :head do %>

    <link href="/assets/javascripts/dhtmlxSuite_v30/dhtmlxLayout/codebase/dhtmlxlayout.css" media="all" rel="stylesheet" type="text/css" />
    <link href="/assets/javascripts/dhtmlxSuite_v30/dhtmlxLayout/codebase/skins/dhtmlxlayout_dhx_skyblue.css" media="all" rel="stylesheet" type="text/css" />
    <link href="/assets/javascripts/dhtmlxMessage/codebase/message_skyblue.css" media="all" rel="stylesheet" type="text/css" />

    <%= javascript_include_tag "/assets/javascripts/nx/nxcommon.js" %>
    <%= javascript_include_tag "/assets/javascripts/nx/dateformat.js" %>
    <script src="/assets/javascripts/dhtmlxSuite_v30/dhtmlxLayout/codebase/dhtmlxcommon.js" type="text/javascript"></script>
    <script src="/assets/javascripts/dhtmlxSuite_v30/dhtmlxLayout/codebase/dhtmlxcontainer.js" type="text/javascript"></script>
    <script src="/assets/javascripts/dhtmlxSuite_v30/dhtmlxLayout/codebase/dhtmlxlayout.js" type="text/javascript"></script>
    <script src="/assets/javascripts/dhtmlxMessage/codebase/message.js" type="text/javascript"></script>

  <title>GourmIndia System</title>

    <style type="text/css">
        html,body {
            background-color: #fff;
            color: #666;
            text-align: left;
            font-family: arial, sans-serif;
            width:100%;
            height:100%;
            margin:0px;
            overflow:hidden;
        }
    </style>

    <script type="text/javascript">

      var lyoMain;
      var dsCity;
      function doOnLoad()
      {
          SiteStatus = '<%= @sitestatus %>'
          setupLayout();
      }


      function setupLayout()
      {
          lyoMain = new dhtmlXLayoutObject(document.body,'2E','dhx_skyblue');
          lyoMain.cells('a').hideHeader();
          lyoMain.cells('b').hideHeader();
          lyoMain.cells('a').setHeight(60);
          lyoMain.cells('a').fixSize(true,true);
          lyoMain.cells('b').fixSize(true,true);
          lyoMain.cells('a').attachURL('/banner/index');
          switch(SiteStatus)
          {
              case 'LIVE':
                  lyoMain.cells('b').attachURL('/user/index');
                  break;
              case 'MAINT':
                  dhtmlx.modalbox({
                      text: '<%= @sitestatusmsg %>'
                  });
                  break;
          }
      }

      function doUnLoad()
      {

      }

    </script>
<% end %>

可以看出虽然它有.erb扩展名,但除了顶部的content_for和一些javascript_include_tags之外,几乎没有Rails Views类型的功能。

在Rails 3.2下,所有DHTMLX库都位于public / assets / javascript / dhtmlxSuite_v30 /!组件名称下!/ codebase / * .js&amp; * .css文件。所有这些在Rails 3.2中都运行良好。

现在,当我尝试在Rails 5.1中做类似的事情时,我遇到了资产管道概念,尽管已经多次读过Rails指南但我仍然努力了解我应该放置DHTMLX文件的位置,以及我应该如何调用仅在每个相关视图中包含特定的文件。

0 个答案:

没有答案