Static GitHub Issues

[2922] Issue with global plugins?

prev: base
next: The 91% chunk asset optimization problem

Hi!

In my nuxt.config.js I am loading a 'global' js where everything I need everyone is defined. I am doing it like this:

  plugins: [
    {
      src: '~/plugins/global',
      ssr: false
    }
    ],

and global is really just this:

import Popper from 'popper.js/dist/umd/popper.js';
import Vue from 'vue';
import VueRouter from 'vue-router';
import Axios from 'axios';
import Form from './forms/form.js';
import Global from './globals/globals.js';


try {
  window.$ = window.jQuery = require('jquery');
  window.Popper = Popper;
  require('bootstrap');
} catch (e) {}


window.Vue = Vue;
window.VueRouter = VueRouter;
window.Form = Form;
window.Global = Global;
window.axios = Axios;

Now what is the problem.

on /login I have

export default {
  data() {
    return {
      success: false,
      failure: false,
      username: '',
      baseURL: process.env.API_URL,
      form: new Form({
        email: '',
        password: ''
      })
    }
  },

But of course, Form is defined globally so that's fine. It isn't, really. If you run npm run dev for the first time and go to localhost:3000 and then go to /login it is fine. If I stay on /login page, make a change anywhere so that it re-compiles. I get an error saying that Form class is not defined in /login. But if I go back to root '/' and then to '/login' it works. Is there any way to avoid this behavior?

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2536">#c2536</a>)</em></sub></div>