Uncaught ReferenceError: vm is not defined vue.js 2.0

Question

I am using Vue 2.0 and I have an error

(Uncaught ReferenceError: vm is not defined)

when i use vm.$data or any other in console to check the properties. I have latest version of vue.js 2.2.4.

what is vm, have you assigned it somewhere? – Saurabh Mar 14 '17 at 10:13 — Saurabh, Mar 14 '17 at 10:13

Abdullah Khan · Answer 1 · 2021-03-10T04:08:59.037

15

As mentioned by @Fiete the vm variable wont be available by default.

You need to define vm globally to access it from the console.

Something like this should work

var vm = new Vue({
  el: '#app',
  data: {
    a: 1
  },
  router,
  template: '<App/>',
  components: {
    App
  }
});

global.vm = vm; //Define your app variable globally

Now you can use vm.$data.PROPERTY or vm.PROPERTY.

edited Mar 10 '21 at 04:08

answered May 29 '17 at 17:08

Abdullah Khan

12,010
6
65
78

1

It's because of webpack packing of js files :) here is the more detailed answer: https://stackoverflow.com/a/40416826/2842750 – Pavel Biryukov Jul 15 '18 at 04:56

score 2 · Answer 2 · answered Mar 14 '17 at 13:14

The vm variable does not exists by default. And vuejs does not set that variable. If you want to debug your vuejs application I recommend the vuejs Chrome extension.

By opening the extension on your page you can select the component you want to debug. After that you can access the selected component by using the $vm0 variable.

score 0 · Answer 3 · answered Dec 26 '18 at 14:59

0

let app = new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')


global.vm = app;

in anywhere,

globalThis.vm.$subscribeTo...

answered Dec 26 '18 at 14:59

serkan

6,885
4
41
49

score 0 · Answer 4 · answered Feb 05 '20 at 09:12

0

vm looks like referring to the Vue instance, then just use this.$set instead of vm.$set. (Worked on a project generated with @vue/cli)

answered Feb 05 '20 at 09:12

Mathias Osterhagen

402
1
3
19

score 0 · Answer 5 · answered Aug 17 '21 at 13:22

It's really old, but for me the issue was that $vm would become unavailable when I was not focused on the tab / had different tab open. I just had to re-focus on the tab for which the devtools was open and $vm would appear again.

If just re-focusing won't do the trick, sometimes it helps to roam around Vue devtools Components tab until you see $vm written along the component names.

Uncaught ReferenceError: vm is not defined vue.js 2.0

5 Answers5