Run vue component only if element loaded

Question

I have a small vue.js component defined on a javascript.

Is any elegant way to instance the vue component only when the element is loaded?

The issue is I am receiving these warnings in other htmls where the element is not present:

vue.js:485 [Vue warn]: Cannot find element: #item

Because it's running this js everywhere

  new Vue({
    el: '#item',
  });

How is it taken care of in vue.js?

Answer 1

Test for the element before creating the instance.

if(document.getElementById("#item")){
  new Vue({
    el: '#item',
  });
}