diff --git a/examples/vue-chartjs/components/bar-chart.js b/examples/vue-chartjs/components/bar-chart.js
index f6440d4b2f..c84f42d553 100644
--- a/examples/vue-chartjs/components/bar-chart.js
+++ b/examples/vue-chartjs/components/bar-chart.js
@@ -1,8 +1,9 @@
 import { Bar } from 'vue-chartjs'
 
-export default Bar.extend({
+export default {
+  extends: Bar,
   props: ['data', 'options'],
   mounted() {
     this.renderChart(this.data, this.options)
   }
-})
+}
diff --git a/examples/vue-chartjs/components/doughnut-chart.js b/examples/vue-chartjs/components/doughnut-chart.js
index f972ab4dc9..de159ec840 100644
--- a/examples/vue-chartjs/components/doughnut-chart.js
+++ b/examples/vue-chartjs/components/doughnut-chart.js
@@ -1,8 +1,9 @@
 import { Doughnut } from 'vue-chartjs'
 
-export default Doughnut.extend({
+export default {
+  extends: Doughnut,
   props: ['data', 'options'],
   mounted() {
     this.renderChart(this.data, this.options)
   }
-})
+}
diff --git a/examples/vue-chartjs/package.json b/examples/vue-chartjs/package.json
index e3217175f5..90319704d1 100644
--- a/examples/vue-chartjs/package.json
+++ b/examples/vue-chartjs/package.json
@@ -2,10 +2,10 @@
   "name": "vue-chartjs-nuxt",
   "dependencies": {
     "axios": "^0.16.2",
-    "chart.js": "^2.6.0",
+    "chart.js": "^2.7.1",
     "moment": "^2.18.1",
     "nuxt": "latest",
-    "vue-chartjs": "^2.8.2"
+    "vue-chartjs": "^3.1.0"
   },
   "scripts": {
     "dev": "nuxt",