Vue.js app throws error "Cannot find element: #app"

Question

I am currently using Webpack as a build system and have set up everything properly so that it was working well.

All of the sudden, it started giving me an error stating:

[Vue warn]: Cannot find element: #app

I tried running the beforeCreated() hook on the root instance itself, where if the element does not exist I manually create it. But to no avail.

I have uploaded my code to Gitub, with a package.json file. It would be really amazing if someone can take a look and provide a solution.

I went spend hours going trough the code and even removed all other dependencies, but the most basic configurations, changed the import order and it still doesn't work.

Here is the link to the Github repo: Github

The code that created the #app div is commented out right now. — Emile Bergeron
– Emile Bergeron, Commented Jun 12, 2018 at 19:54
Yes, but it didn't work with it either. The element exists in a component which is imported prior to the Vue instance — Johny Peshehodeca
– Johny Peshehodeca, Commented Jun 12, 2018 at 20:01
Either you create the element before and mount the vue after, or you put a <div id="app"></div> in the index.html before the js bundle. — Emile Bergeron
– Emile Bergeron, Commented Jun 12, 2018 at 20:06
I downvoted because questions seeking debugging help should have a minimal reproducible example in the question itself. The comment was just to try and help anyway. — Emile Bergeron
– Emile Bergeron, Commented Jun 12, 2018 at 20:08

AMIC MING · Accepted Answer · 2018-11-02 22:15:43Z

2

I think you are missing a #app element in the index.html to mount the app:

<body>
    <div id="app"></div>
    <script src="/dist/build.js"></script>
</body>

edited Nov 2, 2018 at 22:15

AMIC MING

6,3646 gold badges50 silver badges63 bronze badges

answered Jun 12, 2018 at 19:51

Christophe

1921 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Johny Peshehodeca Over a year ago

The problem is that Vue cannot be mounted on <html> or <body> it has to use another element

Collectives™ on Stack Overflow

Vue.js app throws error "Cannot find element: #app"

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related