Vue

not working

by nicolas1000

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/3.1.3/vue-router.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/apexcharts/3.8.6/apexcharts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-apexcharts"></script>
 
 
 <html>
  <head>
   <script src="https://unpkg.com/vue@latest/dist/vue.js"></script>
   <script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
 <!-- CHARTS -->
	
	<script src="https://cdn.jsdelivr.net/npm/apexcharts" type="module"></script>
	<script src="https://cdn.jsdelivr.net/npm/vue-apexcharts" type="module"></script>
  </head>
 <body >
 <div id ="app">
 

 
 <router-link to="/home">Home</router-link>
 <router-view></router-view>
 
 </div>
 
 </body>

JavaScript

Vue.use(VueApexCharts)

const Home = {
  data: function() {
    return {
      options: {
        chart: {
          id: 'vuechart-example'
        },
        xaxis: {
          categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998]
        }
      },
      series: [{
        name: 'series-1',
        data: [30, 40, 45, 50, 49, 60, 70, 91]
      }]
    }
  },
  components: {
     apexcharts: VueApexCharts
  },
  template:
    '<div><apexchart width="500" type="bar" :options="options" :series="series"></apexchart></div>'
};


const routes = [
  { path: "/home", component: Home },

  
];

const router = new VueRouter({
  routes // short for `routes: routes`
});

const app = new Vue({
  router
}).$mount("#app");