How to fix NuxtJs console errors

Viewed 418

enter image description here

Q1: Why You are running Vue in development mode. appearing twice in the console?

Found a way to get rid of this message did the following, but now it is being printed 1 time.

In nuxt.config.js

vue: {
  config: {
    productionTip: false,
    devtools: true
  }
}

Q2: What is Mismatching childNodes vs. VNodes? Please guide me, how to debug/fix this issue?

I have searched everywhere in the project for this element, is it some kind of cache?

1 Answers

The first is probably because you have SSR + client sending the message (could try to only have an SPA for testing purposes) or it's because you did not toggled off the console.log in your vue devtools settings at "Detected Vue message" section.

Then second one is because your server markup is not matching your client markup, probably because you do have some client side code that is altering the markup generated on the server without it having any information (with something like client-only).

More info here: https://blog.lichter.io/posts/vue-hydration-error/

Related