保留jQuery的依赖与requireJS优化highcharts(Preserving jQuer

我测试了requireJS和我试图让使用highcharts一个简单的项目。我已经开始与requireJS多页示例项目作为起点。

我的目录结构看起来一样的基本结构，与在lib目录添加highstock.js。

page1.html：第1页的应用程式。
page2.html：应用程序的第2页。
JS
- 应用：用于存储应用程序特定模块的目录。
- LIB：该目录来存放第三方模块，如jQuery。
- common.js：包含requirejs配置，这将是该组通用模块构建目标。
- page1.js：用于数据主要为page1.html。加载通用模块，然后加载应用程序/ MAIN1，第1页主模块。
- page2.js：用于数据主要为page2.html。加载通用模块，然后加载应用程序/ MAIN2，2页主模块。

common.js拥有的配置，我已经添加了highstock有垫片：

requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        app: '../app'
    },
    shim: {
        "highstock": {
            "exports": "Highcharts",
            "deps": [ "jquery"] 
        },
    } // end Shim Configuration
  } );

我也正在使用的基础构建文件，添加一行来设置common.js为配置文件和其他禁用缩小文件。

optimize: "none",
mainConfigFile: '../www/js/common.js',

在应用/ main1.js我已经添加了var HighCharts= require('highstock'); 我再尝试使用它。

当我运行这在普通身材的一切工作正常。所有的依赖把握和一切加载。

当我尝试优化我的身材，highcharts不接收jQuery的依赖。我想我明白为什么它的发生，但我不知道如何解决它。

我的版本会创建3个文件，common.js，page1.js和page2.js。

构建输出的相关部分：

js/lib/../common.js
----------------
js/lib/../common.js
js/lib/jquery.js
...

js/lib/../page1.js
----------------
js/lib/../page1.js
js/lib/highstock.js
js/app/main1.js
...

然后我的页面引用内置第1页。当尝试加载highstock模块就错误了，因为jQuery的尚未加载/不可访问。

当我看到内置第1页我明白为什么。

require(['./common'], function (common) {
    require(['app/main1']); //highcharts is in main1 in the non-optimized version
});

define("../page1", function(){});
//a few more defines

(function () { // start highcharts module definition HERE

因此，而不是常见的（包括jQuery的）已经被加载，使得请求后其加载，但回调执行之前之后的回调被定义。

我的问题是，这是为什么，而不是发生在那里的回调内（这是它在非优化的版本被加载）。我试着在build.js文件和配置文件的多个选项，我似乎缺少一些关键的概念或小的错误。

对不起，超长的问题，但我觉得所有的信息是必要的。如果需要更多的信息，我可以将它张贴，或摆脱的东西是多余的。

Answer 1:

请大家看一下它的使用需要JS很简单的例子http://jsfiddle.net/wAM3h/

    require({
    paths: {
        jquery: "//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min",
        hchart: [
            "http://code.highcharts.com/highcharts",
            "http://code.highcharts.com/highcharts-more",
            "http://code.highcharts.com/modules/exporting"
        ]
    }
},
['jquery', 'hchart'], function($, hc) {

    window.chart = new Highcharts.Chart(options);
    });

Answer 2:

不知道你还参与项目与否：

我看到你没有定义path到highcharts的代码库之上。我看不出它甚至在你提到的回购。

并再次， highcharts防止这个命名空间的重新申报，所以你必须使用一个不同的名称-因此，您必须使用一个不同的名称，而垫片明它

注：像图书馆highcharts可以在AMD模块中安全使用，而无需使用垫片（除非你需要通过它导出的对象明确的访问）。

所以，你的配置文件应该是这样的：

requirejs.config({
    baseUrl: 'js/lib',
    paths: {
        app: '../app',
        'highstock-custom-name': 'path/to/highcharts.js'
    },
    shim: {
        "highstock-custom-name": {
          ... //as is, although not necessary
        }
    }
});