How to fix Uncaught ReferenceError: htmlLegendPlugin is not defined

I got this error transferring Chart.js integration into a content management system:

main.js?v=1.X:213 Uncaught ReferenceError: htmlLegendPlugin is not defined
    at Object.loadCharts 
    at XMLHttpRequest.request.onreadystatechange

This comes from Chart.js looking for a defined legend but not finding it. S

Solution

Make sure the following is loaded before your other scripts:

const htmlLegendPlugin = {
    id: 'htmlLegend',
    afterUpdate(chart, args, options) {
        charts.afterUpdate(chart, args, options)
    }
};