I installed vue-ellipse-progress plugin and "document is not defined" error getting every time

Question

 
  

 `import VueEllipseProgress from 'vue-ellipse-progress';
  export default {
   components: {
       VueEllipseProgress
       }
  }`

document is not defined error when everytime this is running i also checked to remove server side rendering and same also

Are you using vue cli? if so my guess is that globals are disabled, `app.config.globalProperties.window = window` and `app.config.globalProperties.document = document` — Michael Mano, Apr 21 '21 at 05:56
ok, This solution is what you are after since its NUXT. document and windows dont exist. https://stackoverflow.com/questions/46058544/document-is-not-defined-in-nuxt-js — Michael Mano, Apr 21 '21 at 06:01

score 3 · Accepted Answer · answered Apr 21 '21 at 08:29

Here an example how you can include vue-ellipse-progress globally to your project.

plugins/vue-ellipse-progress.js Create plugin.

import Vue from 'vue';
import VueEllipseProgress from "vue-ellipse-progress";
Vue.use(VueEllipseProgress);

nuxt.config.js Include plugin in config.

plugins: [
    {
      src: '@/plugins/vue-ellipse-progress.js',
      mode: 'client'
    },
  ],

your-component.vue Use component.

<client-only>
     <vue-ellipse-progress :progress="50" />
</client-only>

thanks the "document is not defined" error is gone but component progress bar is missing — Abhishek, Apr 21 '21 at 08:34

1 Answers1