TypeError: Cannot read property 'getContext' of undefined

[felix2056]

Expected Behavior

Chart should display

Actual Behavior

Chart doesn't display

Environment

• vue.js version: <2.2>
• vue-chart.js version:
• npm version: <6.13.4>

[johngoben-righteye]

The problem is probably that you have a template tag. See #156.

[apertureless]

Let me check my 🔮 .
Please provide a reproduction.

[ramey29]

the error is due to this.$refs.canvas.getContext('2d') in BaseCharts.js , hence you can just add reference for the canvas object by adding below line to your template <canvas ref="canvas"></canvas>
and it shall work or remove <template></template> tag

[apertureless]

There is no need to add any canvas to your template, because thats the actual problem.
If you have even an empty <template> tag in your SFC with your chart, the template content of the base chart will be overwritten, hence the canvas element will be deleted.

Removing the template tag is the proper fix.