Question

背景

我正在寻找替代当前技术，用于加载我的curljs模块的highcharts.js。目前我正在以这种方式加载所需的库：

define("Test", ["jquery",
    "js!https://code.highcharts.com/highcharts",
    "js!https://code.highcharts.com/highcharts-more",
    "js!https://code.highcharts.com/modules/exporting"],

function ($, hchart, hchartmore, hchartexp) {
    var testFunc = function () {
        return {
            markup: function () {
                $("#mixer").html("did it");
            },
            chartIt: function () {
                window.chart = new Highcharts.Chart({

               // do the highchart configs});
    };


    return testFunc;
});

目前有效，您可以参考我的jsfiddle demoing my current solution。

我尝试使用 js！插件来填充Highchart，并创建curl文档指定的curl配置对象：

curl = {
    baseUrl: "",
    paths: {
        "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js",
        "hchart": "js!https://code.highcharts.com/highcharts",
        "hchartmore":"js!https://code.highcharts.com/highcharts-more",
        "hchartmore":"js!https://code.highcharts.com/modules/exporting"}
};

但是当curl尝试读取highchart.js文件时，我收到“define（）缺失或重复”错误。

我的问题是我的解决方案是合适的，即使它有效吗？有替代方案吗？

Answer 1

尝试使用curl.js的旧版加载程序。它非常适合全局脚本，例如highcharts。

var hchartBase = "https://code.highcharts.com/";
var hchartCfg = {
    loader: "curl/loader/legacy",
    exports: "Highcharts"
};
curl.config({
    baseUrl: "",
    paths: {
        "curl": "your/path/to/curl/curl.js",
        "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js",
        "hchart": { location: hchartBase + "highcharts", config: hchartCfg },
        "hchartmore": { location: hchartBase + "highcharts-more", config: hchartCfg },
        "hchartexp": { location: hchartBase + "modules/exporting", config: hchartCfg }
    }
});

请注意，我添加了一个卷曲路径。这是curl查找遗留加载程序所必需的。

通常情况下，你不会对所有三个库使用相同的遗留配置，但由于我无法判断highcharts-more和导出的libs是否没有声明curl可以代表你导出的任何有用的全局变量，我只是为这三个使用相同的配置。

更多信息在这里：https://github.com/cujojs/curl/tree/master/src/curl/loader

将Highcharts与Curljs集成的最佳方法是什么？

1 个答案: