Charts.js integration with Vue without a wrapper

Component.vue

<template>
	<div class='error'>
		<h1>Test Charts.js</h1>
		<canvas id='chart-canvas'></canvas>
	</div>
</template>

<script>
import Chart from 'chart.js';

let canvasContext = null;
let chart = null;

export default {
	mounted () {
		this.renderChart([12, 19, 3, 5, 2, 3]);
	},
	destroyed () {
		canvasContext = null;
		if (chart !== null) chart.destroy();
		chart = null;
	},
	methods: {
		renderChart (data) {
			canvasContext = document.getElementById('chart-canvas').getContext('2d');

			if (chart !== null) chart.destroy();

			chart = new Chart(canvasContext, {
				type: 'bar',
				data: {
					labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
					datasets: [{
						label: '# of Votes',
						data: data,
						backgroundColor: [
							'rgba(255, 99, 132, 0.2)',
							'rgba(54, 162, 235, 0.2)',
							'rgba(255, 206, 86, 0.2)',
							'rgba(75, 192, 192, 0.2)',
							'rgba(153, 102, 255, 0.2)',
							'rgba(255, 159, 64, 0.2)'
						],
						borderColor: [
							'rgba(255,99,132,1)',
							'rgba(54, 162, 235, 1)',
							'rgba(255, 206, 86, 1)',
							'rgba(75, 192, 192, 1)',
							'rgba(153, 102, 255, 1)',
							'rgba(255, 159, 64, 1)'
						],
						borderWidth: 1
					}]
				},
				options: {
					scales: {
						yAxes: [{
							ticks: {
								beginAtZero: true
							}
						}]
					}
				}
			});
		}
	}
};
</script>

Install Chart.js with npm install chart.js