Javascript 为什么Highchart在我的rails应用程序中加载了两次？（未捕获的高图表错误#16）

我不能把工作作为海图的基本例子

我犯了以下错误：

app/assets/javascripts/application.js中的

Uncaught Highcharts错误#16

未捕获类型错误：未定义不是app/assets/javascripts/graphique\u repartition\u budgetaire中的函数

Highcharts表示错误16是因为：

此错误在第二次加载Highcharts或Highstock时发生
在同一页中，已定义Highcharts命名空间。保持
请记住，Highcharts.Chart构造函数和
Highcharts包含在Highstock中，所以如果您正在运行Chart和
结合StockChart，您只需加载highstock.js
文件

但我不明白为什么Highcharts可以在同一页中加载两次

我正在使用Rails 3.2.21

我把这个放进我的档案：

gem 'jquery-rails'
gem 'highcharts-rails', '~> 3.0.0'

我将其放入我的app/assets/javascripts/application.js中：

//= require jquery
//= require jquery_ujs
//= require_tree .
//= require highcharts

我将其放入我的app/views/layouts/application.html.haml：

%html
  %head
    %title My title blablabla
    = javascript_include_tag 'application'
    = stylesheet_link_tag    'application', :media => 'screen'
    = stylesheet_link_tag    'application', :media => 'print, projection'
    /[if IE]
      = stylesheet_link_tag    'application', :media => 'screen, projection'
    = csrf_meta_tags
...

这是我认为的代码（类似于HAML）：

这是我在样式表中输入的内容（类似SASS）：

这是我放在app/assets/javascripts/graphique\u repartition\u budgetaire.js中的代码（来自Highcharts示例）

$(function () {
    $('#graphique-repartition-budgetaire').highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Fruit Consumption'
        },
        xAxis: {
            categories: ['Apples', 'Bananas', 'Oranges']
        },
        yAxis: {
            title: {
                text: 'Fruit eaten'
            }
        },
        series: [{
            name: 'Jane',
            data: [1, 0, 4]
        }, {
            name: 'John',
            data: [5, 7, 3]
        }]
    });
});

=======编辑1======

我注意到，在不使用任何ID的其他页面上也会发生此错误：#graphique repartition budgetaire”。
换句话说，错误也发生在不使用javascript Highcharts的页面上

因此，这排除了调用javascript图表示例函数的视图本身的错误（当然每个页面都会调用Highcharts.js）。
问题应该出在别的地方

=======编辑2======

我简单地检查jquery是否正常工作。
它失败了。它没有在我的页面上显示“测试”。
因此jquery和Rails3.2肯定有问题。
我在stackoverflow上看到，有些人在使jquery工作时也遇到了问题，但我现在还没有找到任何有效的解决方案

=======编辑3======

推荐的脚本有问题。在我将脚本保存到app/assets/javascript/display\u my\u div.js文件中并将其更改为以下文件之前，该脚本不起作用：

$(function() {
  $('#mydiv').show();
});

因此，JQuery工作起来很有魅力。这个问题与Highcharts库密切相关。
好的，我发现rails在执行
rake assets:precompile
时存在一个bug，这将导致包含来自app/assets和public/assets的两倍JS代码

这个bug自2013年4月起就被引用，但rails社区似乎不愿意纠正它

作为解决方法，我只是：

运行
rake资产：清理

将行
/=require highcharts
添加到
app/assets/javascripts/application.js
运行rake资产：预编译
删除app/assets/javascripts/application.js中的行
/=require highcharts

所以Highchart库是在公共/资产的资产管道中预编译的

这有点奇怪，但它在开发中起作用

我仍然需要在生产中测试它，以确认它是否继续工作

==编辑1===

事实上，它比这更简单：
在开发模式下，Rails自动编译JS文件，但如果它们已经用
rake:assets precompile
命令预编译并压缩成文件（我还不记得在哪里）；那么Rails将同时使用JS代码。
这当然不会发生在生产模式中，因为（通常）没有激活自动编译模式（出于性能考虑）

$(function () {
    $('#graphique-repartition-budgetaire').highcharts({
        chart: {
            type: 'bar'
        },
        title: {
            text: 'Fruit Consumption'
        },
        xAxis: {
            categories: ['Apples', 'Bananas', 'Oranges']
        },
        yAxis: {
            title: {
                text: 'Fruit eaten'
            }
        },
        series: [{
            name: 'Jane',
            data: [1, 0, 4]
        }, {
            name: 'John',
            data: [5, 7, 3]
        }]
    });
});

$(function() {
  $('#mydiv').show();
});