Loading Highcharts with require.js

Question

I have been trying for some time with little success to be able to load highcharts as a require module. I was wondering if anyone had managed to get this working, or if they had any pointers to get me on the right track?

Thank you

Answer 1

With require.js 2.1.0+ a plugin is not necessary. You can include Highcharts with a shim:

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

Answer 2

I just got it to work as follows:

1. Add this at the top:

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

2. Add this at the very end:

   return window.Highcharts; });

This assumes you have jquery already defined, eg

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

You can follow this general approach for most third party libraries. For example, I did this for jquery.tmpl.js and knockout.js.