Home

I use vue-scroller of the vue Plugins in my project. It work on the initial load but when the page is refreshed，I get 2 errors, the first is “document is not defined” then if I refresh the page again i’ll get “Error: render function or template not defined in component: anonymous”.

I have already set SSR to false for vue-scroller in the nuxt.config.js but not resolved the ‘document is not defined’

So, can you help me?

.vue file

   <template>
       ...
        <scroller style="top: 97px" :on-infinite="loadMore">
        </scroller>
     ....
    </template>
    ...
    <script>
         import Vue from 'vue';
         import Scroller from 'vue-scroller';
         Vue.use(Scroller)
        ...
    </script>
   

---

nuxt.config.js

    ...
    plugins: [
    {
      src:'~plugins/vue-scroll.js',
      ssr:false
    }
   ],
    ...

---

vue-scroll.js

import Vue from 'vue';
import Scroller from'vue-scroller';

Vue.use(Scroller);