Search code examples
gulpbrowserifyvue.jslaravel-elixir

Vue root instance being duplicated after recent patch


Since v1.0.18, Vue.js has been duplicating my root component, as evidenced by a simple example of putting an alert('hey!') inside of the data() function. Since the root component gets duplicated, every child of it also is duplicated, resulting in twice the AJAX requests as necessary, etc. Curiously, the state actually persists across both (every user is duplicated in the user array), but that's beside the point.

The only part of the setup I can think to blame would be between gulp, browserify, or laravel-elixir-vueify.Can anyone think of a reason why these newer versions of Vue might cause an issue of the Vue components being duplicated in my app?

Code can be viewed on the Vue forum page here. Thanks!


Solution

  • Turns out this was a bug introduced in Vuejsv1.0.18 and a commit on Git is fixing it.

    My entire component wasn't being duplicated, just the data() hook was being called twice.

    Just as a PSA: don't send AJAX requests (like I was) from within data(), use activate() instead!

    GitHub bug thread