Загрузка Highcharts с require.js

Question

Я пытался какое-то время с небольшим успехом, чтобы иметь возможность загружать старшие графики как необходимый модуль. Мне было интересно, удалось ли кому-нибудь заставить это работать, или у них были какие-то указатели, чтобы направить меня на правильный путь?

Спасибо

Answer 1

С require.js 2.1.0+ плагин не нужен.Вы можете включить Highcharts с shim :

require.config({
  paths: {
    require: "libs/require",
    jquery: "libs/jquery",
    highcharts: "libs/highcharts"
  },
  shim: {
    highcharts: {
      exports: "Highcharts",
      deps: ["jquery"]
    }
  } // end Shim Configuration
});

Answer 2

Минимальный пример недавнего подхода для Highcharts с модулем ( Пример JSFiddle ):

require.config({
    paths: {
        highcharts: "https://code.highcharts.com/highcharts",
        highcharts_exporting: "https://code.highcharts.com/modules/exporting"
    }
});

require(['highcharts', 'highcharts_exporting'], function(Highcharts, exporting) {
    exporting(Highcharts); // We need to initialize module files and pass in Highcharts

    Highcharts.chart('container', {
        series: [{
            data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
        }, {
            data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
        }]
    });
});

См. эту документацию Highcharts для описания использования.

Answer 3

Использование недавнего плагина use.js определенно поможет. Редактирование сторонних библиотек, как было предложено в моем предыдущем ответе, является проблемой для удобства обслуживания.

Answer 4

Я просто заставил его работать следующим образом:

1. Добавьте это вверху:

   define(['jquery'], function (jQuery) {
   

2. Добавьте это в самом конце:

   return window.Highcharts; });

Предполагается, что вы уже определили jquery, например,

require.config({
    paths: {
        'jquery': 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min'
     }
});

Вы можете следовать этому общему подходу для большинства сторонних библиотек. Например, я сделал это для jquery.tmpl.js и knockout.js.