[1700] [Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

In Nuxt, if I try to add third party plugin for example vue-date-picker like this

<template>
   <div>
       <datepicker :readonly="true" format="YYYY-MM-DD"></datepicker>
    </div>
</template>




<script>
let datepicker = null
// The server-side needs a full url to works
if (process.browser) {
  datepicker = require('vue-date-picker').default
}


export default {
  components: {datepicker}
}
</script>

DatePicker works perfectly. But the following warning occurs

Vue warn: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>,or missing <tbody>. Bailing hydration and performing full client-side render.

How to get rid of it?