Solvedvue slider component Vue initialized twice

Issuehunt badges

Describe the bug

After including slider for use

 import  VueSlider from 'vue-slider-component'; 
 Vue.component('VueSlider', VueSlider);

I see the vue development message twice.

You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at

The first from my main needed.js where i initialized my vue.
The second is from webapp.js where i included the slider.

When i click on any element after adding this slider i get this error.

[Vue warn]: $attrs is readonly.

From this post on stackoverflow:
The $attrs, $listeners and other warnings are displayed if there's more than one instance of Vue loaded

Is there anything i can do to resolve this?

Vue: 2.6.10
Vue-router: 3.0.3
Vue-slider-component: 3.0.36

There is a $50.00 open bounty on this issue. Add more on Issuehunt.

46 Answers

✔️Accepted Answer

Specific to a Rails app:

Hmmm...I think I just got rid of my duplicate loading error... Added this to my config/webpack/environment.js file:

// see
const resolver = {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js'

Need to do some more testing to verify, but I thought I'd add this now for anyone using Rails and having the problem.

Other Answers:

@feldsam It has been tested that the slider does not work in versions prior to vue2.6.0 after removing require('vue').

So I updated it by releasing a beta version:

  yarn add vue-slider-component@beta
  # npm install vue-slider-component@beta --save

More Issues: