npmmvvm95% confidence\u2191 205

[Vue warn]: Cannot find element

Full error message
I'm using Vuejs. This is my markup:

<body>
  <div id="main">
    <div id="mainActivity" v-component="{{currentActivity}}" class="activity"></div>
  </div>
</body>

This is my code:

var main = new Vue({
    el: '#main',
    data: {
        currentActivity: 'home'
    }
})
;

When I load the page I get this warning:

[Vue warn]: Cannot find element: #main

What am I doing wrong?

I think the problem is your script is executed before the target dom element is loaded in the dom... one reason could be that you have placed your script in the head of the page or in a script tag that is placed before the div element #main. So when the script is executed it won't be able to find the target element thus the error. One solution is to place your script in the load event handler like window.onload = function () { var main = new Vue({ el: '#main', data: { currentActivity: 'home' } }); } Another syntax window.addEventListener('load', function () { //your script })

API access

Get this solution programmatically \u2014 free, no authentication.

curl https://depscope.dev/api/error/4d34060766d30884761c75dac6864ddad69b5b58e7571c2dbdbd1fe96ddbbc77
hash \u00b7 4d34060766d30884761c75dac6864ddad69b5b58e7571c2dbdbd1fe96ddbbc77
[Vue warn]: Cannot find element — DepScope fix | DepScope