nuxt.js 文件未定义，pugin 有问题

Question

I added plugin: vue-burger-menu to my nuxt.js project. And i have an error: "document is not defined" . I know, that this plugin is available only for client-side. So I found in vue documentation enter link description here what I have to do to fix it. It works only for first refresh. Then I have again document is not defined.

nuxt.config.js :

  build: {
vendor: ['vue-burger-menu'],
 }

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

Add a file to my plugins folder called "vue-burger-menu.js" :

 import Vue from 'vue';
 import VueBurgerMenu from 'vue-burger-menu';

   if (process.browser) {

      Vue.use(VueBurgerMenu);

   }

nav template

 <template lang="pug">
   Slide(right)
        nav.menu_vertical
 </template>

 <script>
 import { Slide } from 'vue-burger-menu'
 export default {
 name: 'Nav',
 components: {
   Slide
 },
}

Answer 1

Replace deprecated process.browser with process.client

if (process.client) {
   Vue.use(VueBurgerMenu);
}

Answer 2

Nuxt is doing SSR and document is only available in browser so you need to wrap your plugin code like

change "vue-burger-menu.js" as following

import Vue from 'vue';
import VueBurgerMenu from 'vue-burger-menu';

if (process.browser) {

 Vue.use(VueBurgerMenu);

}

you can find detail documentation Here