Error when trying to use CanvasJS via RequireJS - requirejs

Question

I'm trying to use CanvasJS inside my project. I'm using RequireJS to manage the modules, and have this in the main script:
define(['domReady',"canvasjs","common-functions"], function(domReady,CanvasJS) {
domReady(function () {
window.CanvasJS = CanvasJS;
init_page_select();
});
});
This is what I have in my requireJS config file for the path:
"paths": {
// other stuff here
"canvasjs": "node_modules/canvasjs/dist/canvasjs.min"
},
I can see the canvasjs.min.js file being grabbed fine - but then I get this weird error:
ReferenceError: intToHexColorString is not defined[Learn More] canvasjs.min.js:7:7042
[33]</n.prototype.render https://www.test.org/2018/js/lib/node_modules/canvasjs/dist/canvasjs.min.js:7:7042
[28]</n.prototype.render https://www.test.org/2018/js/lib/node_modules/canvasjs/dist/canvasjs.min.js:5:14150
n/this.render https://www.test.org/2018/js/lib/node_modules/canvasjs/dist/canvasjs.min.js:8:17771
init_page_select https://www.test.org/2018/js/lib/spot_view_stats.js:83:2
<anonymous> https://www.test.org/2018/js/lib/spot_view_stats.js:4:3
domReady https://www.test.org/2018/js/lib/domready.js:105:13
<anonymous> https://www.test.org/2018/js/lib/spot_view_stats.js:2:2
execCb https://www.test.org/2018/js/lib/require.js:5:12859
check https://www.test.org/2018/js/lib/require.js:5:6575
enable/</< https://www.test.org/2018/js/lib/require.js:5:9031
bind/< https://www.test.org/2018/js/lib/require.js:5:812
emit/< https://www.test.org/2018/js/lib/require.js:5:9497
each https://www.test.org/2018/js/lib/require.js:5:289
emit https://www.test.org/2018/js/lib/require.js:5:9465
check https://www.test.org/2018/js/lib/require.js:5:7169
enable/</< https://www.test.org/2018/js/lib/require.js:5:9031
bind/< https://www.test.org/2018/js/lib/require.js:5:812
emit/< https://www.test.org/2018/js/lib/require.js:5:9497
each https://www.test.org/2018/js/lib/require.js:5:289
emit https://www.test.org/2018/js/lib/require.js:5:9465
check https://www.test.org/2018/js/lib/require.js:5:7169
enable https://www.test.org/2018/js/lib/require.js:5:9358
init https://www.test.org/2018/js/lib/require.js:5:5716
h https://www.test.org/2018/js/lib/require.js:5:4287
completeLoad https://www.test.org/2018/js/lib/require.js:5:12090
onScriptLoad https://www.test.org/2018/js/lib/require.js:5:13014
I'm invoking it with:
var chart = new CanvasJS.Chart("thegraph",
{
title:{
text: impressionText
},
theme: "theme2",
axisX: {
valueFormatString: "MMM-DD-YYYY",
labelAngle: -50
},
axisY:{
valueFormatString: "#0",
title: impressionText
},
data: [
{
type: "line",
showInLegend: true,
legendText: legendText,
dataPoints: dataPoints
}
]
});
chart.render();
Interestingly, if I tell it to load canvasjs.js instead of canvasjs.min.js, I get another error:
ReferenceError: intToHexColorString is not defined[Learn More]

Answer 1

OK so the problem seemed to be my version. For some reason "npm install canvasjs" was installing 1.8.1, but 2.2 was out. As per their request, I updated it to 2.2 and it sorted the problem. It seems weird npm is running such an outdated version though