每次尝试都未定义 jQuery-fileupload-rails fileupload

Question

我试图在某种程度上遵循this rails cast 以使 jQuery-fileuploader 在带有carrierwave 的rails 中工作。我有carrierwave，其他一切都很好，但是当我尝试使用jquery-fileupload-rails时，我不断收到同样的错误：Uncaught TypeError: Object [object Object] has no method 'fileupload'。当我尝试在控制台中运行$(selector).fileupload() 时也是如此。

宝石文件：

source 'http://rubygems.org'

gem 'rails', '3.2.16'

gem 'mysql2'
gem 'jquery-rails'
gem 'rest-client'
gem 'will_paginate'
gem 'simple_form'
gem 'chronic'
gem 'nokogiri'

gem 'carrierwave'

group :assets do
  gem 'sass-rails'
  gem 'coffee-rails'
  gem 'uglifier'
  gem 'jquery-fileupload-rails'
end

app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require bootstrap_ujs
//= require jquery-fileupload/basic
//= require_tree .

当我在上面有//= require jquery-fileupload 时也会发生这种情况。

我检查了头部，所有脚本都以正确的顺序加载：

<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/bootstrap.js?body=1" type="text/javascript"></script>
<script src="/assets/bootstrap_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-fileupload/vendor/jquery.ui.widget.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-fileupload/jquery.iframe-transport.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-fileupload/jquery.fileupload.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-fileupload/basic.js?body=1" type="text/javascript"></script>
<script src="/assets/uploads.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>

在开发控制台中分析脚本时：

• 脚本 jquery-fileupload/basic.js 只是 5 个空白行...这应该是什么？ This 应该是一个空白文件，因为它包含的只是要包含在资产中的文件管道。

• jquery-fileupload/jquery.fileupload.js 脚本充满了东西，但是当我将整个文件复制并粘贴到控制台并按 Enter 时，它会输出：

Object function ( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init( selector, context, rootjQuery ); } has no method 'widget'

我正在运行捆绑安装，卸载然后重新安装 gem 并重新启动服务器（多次）。经过 5 个小时的失败后，我重新开始并再次尝试。失败了。

更新：

如果我将整个 jquery-fileupload/vendor/jquery.ui.widget.js 文件复制粘贴到控制台中，然后将整个 jquery-fileupload/jquery.fileupload.js 复制粘贴到控制台中，我没有收到上面列出的错误，并且 fileuplaod 方法突然可以调用。这对我来说毫无意义，因为如果它按此顺序包含在头部中，它应该按此顺序运行并且在调用 $(selector).fileupload() 时可用。

Answer 1

通过我的更新，很明显可以看到资产没有正确包含。我几乎肯定，当 javascript 文件都放在一个大文件中时，这将得到解决，并且它们肯定会以正确的顺序执行，因为它们将一起加载。我能够通过以正确的顺序手动加载脚本来解决开发环境中的问题，如下所示：

jQuery ->
  $.getScript "/assets/jquery-fileupload/vendor/jquery.ui.widget.js", () ->
    $.getScript "/assets/jquery-fileupload/jquery.iframe-transport.js", () ->
      $.getScript "/assets/jquery-fileupload/jquery.fileupload.js", () ->
        $(selector).fileupload()

这是非常低效的，因为它会向服务器发出三个请求，等待前一个脚本加载后再调用下一个脚本。这应该不在生产环境中使用。我不确定如何让application.js 构建并用于开发，但我会努力解决这个问题。一旦我可以在生产环境中测试服务器以查看它是否像我期望的那样工作，我会更新这个答案并接受它，如果没有人有更好的答案。

我在 github 上提出了一个关于这个 here 的问题。