Fatal编程技术网
  • jquery/
  • JQuery已经（大部分）停止了在Rails上的工作——资产管道是罪魁祸首吗？

JQuery已经（大部分）停止了在Rails上的工作——资产管道是罪魁祸首吗？

jquery ruby-on-rails datatables

JQuery已经（大部分）停止了在Rails上的工作——资产管道是罪魁祸首吗？,jquery,ruby-on-rails,datatables,asset-pipeline,Jquery,Ruby On Rails,Datatables,Asset Pipeline,接下来，我有了DataTables，一个JQuery插件，在我的Rails 3.2.9应用程序中运行良好 然后它突然停止了工作。（也就是说，这些表现在只呈现为纯HTML。）我不知道是什么变化导致了破坏，我也不知道发生了什么。）可以吗 JQuery似乎加载正常，因为我存储在/app/assets/javascripts/nospam.js中的这个脚本正在执行它在DataTables失败的同一页面上的预期操作： $(window).load(function() { $('#my-email')

接下来，我有了DataTables，一个JQuery插件，在我的Rails 3.2.9应用程序中运行良好

然后它突然停止了工作。（也就是说，这些表现在只呈现为纯HTML。）我不知道是什么变化导致了破坏，我也不知道发生了什么。）可以吗

JQuery似乎加载正常，因为我存储在
/app/assets/javascripts/nospam.js
中的这个脚本正在执行它在DataTables失败的同一页面上的预期操作：

$(window).load(function() {
  $('#my-email').html(function(){
    var e = "steven";
    var a = "@";
    var d = "testivate";
    var c = ".com";
    var h = 'mailto:' + e + a + d + c;
    $(this).parent('a').attr('href', h);
    return e + a + d + c;
  });
});
当我在Chrome中加载页面并转到View>Developer>JavaScript Console>Console时，我看到一个
UncaughtTypeError:Object[Object Object Object]没有方法“dataTable”
连接到包含脚本中带有
return
的行时出错：

(function() {
  jQuery(function() {
    return $('#areas').dataTable({
      bJQueryUI: true
    });
  });
}).call(this);
资产管道似乎正在加载所有正确的文件，因为它生成：

<!DOCTYPE html>
<html>
  <head>
    <title>Testivate</title>
    <!--[if lt IE 9]>
      <script src="/assets/html5shiv-printshiv.js?body=1" type="text/javascript"></script>
    <![endif]-->
    <script src="/assets/jquery.js?body=1" type="text/javascript"></script>
    <script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
    <script src="/assets/dataTables/jquery.dataTables.js?body=1" type="text/javascript"></script>
    <script src="/assets/areas.js?body=1" type="text/javascript"></script>
    <script src="/assets/assignments.js?body=1" type="text/javascript"></script>
    <script src="/assets/categories.js?body=1" type="text/javascript"></script>
    <script src="/assets/heuristics.js?body=1" type="text/javascript"></script>
    <script src="/assets/jquery.placeholder.min.js?body=1" type="text/javascript"></script>
    <script src="/assets/nospam.js?body=1" type="text/javascript"></script>
    <script src="/assets/reports.js?body=1" type="text/javascript"></script>
    <script src="/assets/application.js?body=1" type="text/javascript"></script>
    <link href="/assets/application.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/jquery.ui.core.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/jquery.ui.theme.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/dataTables/src/demo_table_jui.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/_base.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/ie.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/ie6.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/print.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="/assets/screen.css?body=1" media="screen" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Rokkitt:400,700" media="screen" rel="stylesheet" type="text/css" />
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,400" media="screen" rel="stylesheet" type="text/css" />
    <meta content="authenticity_token" name="csrf-param" />
    <meta content="Rss5Hf9sPcQQQRViXgEUfSxvYEshBukjV96gM5+cEYc=" name="csrf-token" />
    <meta content='jq8ezzUss-fo-h7ml8zmwSvdpmzJlbE6VjN7Dphcnp8' name='google-site-verification'>
  </head>
/app/assets/javascripts/areas.js.coffee：

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require_tree .

jQuery ->
  $('#areas').dataTable
    bJQueryUI: true

%table.display#areas
  %thead
    %tr
      %td Foo
      %td Bar
  %tbody
    %tr
      %td Foo
      %td Bar

gem "compass"
gem "sass"
gem "sass-rails"
gem "haml"
gem "haml-rails"
gem "susy"
gem "jquery-rails"
gem "html5shiv-rails"
gem "normalize-rails"

group :assets do
  gem "sass-rails"
  gem "coffee-rails"
  gem "compass-rails"
  gem "compass-susy-plugin"
  gem "fancy-buttons"
  gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
  gem "jquery-ui-rails"
  gem "uglifier"
end

if defined?(Bundler)
  Bundler.require *Rails.groups(:assets => %w(development test))
end

module Testivate
  class Application < Rails::Application
    config.assets.enabled = true
    config.assets.version = '1.0'
  end
end

Testivate::Application.configure do
  config.assets.compress = false
  config.assets.debug = true
end
/app/views/areas/index.html.haml：

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require_tree .

jQuery ->
  $('#areas').dataTable
    bJQueryUI: true

%table.display#areas
  %thead
    %tr
      %td Foo
      %td Bar
  %tbody
    %tr
      %td Foo
      %td Bar

gem "compass"
gem "sass"
gem "sass-rails"
gem "haml"
gem "haml-rails"
gem "susy"
gem "jquery-rails"
gem "html5shiv-rails"
gem "normalize-rails"

group :assets do
  gem "sass-rails"
  gem "coffee-rails"
  gem "compass-rails"
  gem "compass-susy-plugin"
  gem "fancy-buttons"
  gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
  gem "jquery-ui-rails"
  gem "uglifier"
end

if defined?(Bundler)
  Bundler.require *Rails.groups(:assets => %w(development test))
end

module Testivate
  class Application < Rails::Application
    config.assets.enabled = true
    config.assets.version = '1.0'
  end
end

Testivate::Application.configure do
  config.assets.compress = false
  config.assets.debug = true
end
Gemfile：

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require_tree .

jQuery ->
  $('#areas').dataTable
    bJQueryUI: true

%table.display#areas
  %thead
    %tr
      %td Foo
      %td Bar
  %tbody
    %tr
      %td Foo
      %td Bar

gem "compass"
gem "sass"
gem "sass-rails"
gem "haml"
gem "haml-rails"
gem "susy"
gem "jquery-rails"
gem "html5shiv-rails"
gem "normalize-rails"

group :assets do
  gem "sass-rails"
  gem "coffee-rails"
  gem "compass-rails"
  gem "compass-susy-plugin"
  gem "fancy-buttons"
  gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
  gem "jquery-ui-rails"
  gem "uglifier"
end

if defined?(Bundler)
  Bundler.require *Rails.groups(:assets => %w(development test))
end

module Testivate
  class Application < Rails::Application
    config.assets.enabled = true
    config.assets.version = '1.0'
  end
end

Testivate::Application.configure do
  config.assets.compress = false
  config.assets.debug = true
end
/config/application.rb：

//= require jquery
//= require jquery_ujs
//= require dataTables/jquery.dataTables
//= require_tree .

jQuery ->
  $('#areas').dataTable
    bJQueryUI: true

%table.display#areas
  %thead
    %tr
      %td Foo
      %td Bar
  %tbody
    %tr
      %td Foo
      %td Bar

gem "compass"
gem "sass"
gem "sass-rails"
gem "haml"
gem "haml-rails"
gem "susy"
gem "jquery-rails"
gem "html5shiv-rails"
gem "normalize-rails"

group :assets do
  gem "sass-rails"
  gem "coffee-rails"
  gem "compass-rails"
  gem "compass-susy-plugin"
  gem "fancy-buttons"
  gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'
  gem "jquery-ui-rails"
  gem "uglifier"
end

if defined?(Bundler)
  Bundler.require *Rails.groups(:assets => %w(development test))
end

module Testivate
  class Application < Rails::Application
    config.assets.enabled = true
    config.assets.version = '1.0'
  end
end

Testivate::Application.configure do
  config.assets.compress = false
  config.assets.debug = true
end
在Chrome中使用相同的开发工具。单击网络并检查/assets/dataTables/jquery.dataTables.js？body=1是否正在加载。

问题确实出在资产管道上。它正在加载JQuery的两个副本，因为我已经预编译了资产以将其推送到生产环境中，但是预编译的版本在本地挂起，并与动态编译的版本一起提供服务。现在，为了解决如何阻止这种情况发生…

最初，网络选项卡是空的。当我点击刷新时，出现了一个下载列表。在“jquery.dataTables.js”行中，它说：Method:GET；状态：304/未修改；类型：Application/JavaScript；发起人：报告8/解析器；尺寸：252B；时间：596M答案是在推送到Heroku之前不需要在本地预编译您的资产，如果您不需要，Heroku将在生成slug时尝试在服务器上为您预编译它们。美好的