title: [Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. How to find the location?
body: <p>My nuxt.js project shows this issue:</p>
  
  <pre><code>[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 &lt;p&gt;, or missing &lt;tbody&gt;. Bailing hydration and performing full client-side render.
  
  warn    @   vue.runtime.esm.js?2b0e:619
  patch   @   vue.runtime.esm.js?2b0e:6497
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  hydrate @   vue.runtime.esm.js?2b0e:6411
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  hydrate @   vue.runtime.esm.js?2b0e:6411
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  hydrate @   vue.runtime.esm.js?2b0e:6411
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  hydrate @   vue.runtime.esm.js?2b0e:6411
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  init    @   vue.runtime.esm.js?2b0e:3118
  hydrate @   vue.runtime.esm.js?2b0e:6378
  hydrate @   vue.runtime.esm.js?2b0e:6411
  patch   @   vue.runtime.esm.js?2b0e:6493
  Vue._update @   vue.runtime.esm.js?2b0e:3945
  updateComponent @   vue.runtime.esm.js?2b0e:4060
  get @   vue.runtime.esm.js?2b0e:4479
  Watcher @   vue.runtime.esm.js?2b0e:4468
  mountComponent  @   vue.runtime.esm.js?2b0e:4073
  Vue.$mount  @   vue.runtime.esm.js?2b0e:8415
  mount   @   client.js?06a0:709
  _callee5$   @   client.js?06a0:747
  tryCatch    @   runtime.js?96cf:45
  invoke  @   runtime.js?96cf:274
  prototype.&lt;computed&gt;    @   runtime.js?96cf:97
  asyncGeneratorStep  @   asyncToGenerator.js?1da1:3
  _next   @   asyncToGenerator.js?1da1:25
  Promise.then (async)        
  asyncGeneratorStep  @   asyncToGenerator.js?1da1:13
  _next   @   asyncToGenerator.js?1da1:25
  Promise.then (async)        
  asyncGeneratorStep  @   asyncToGenerator.js?1da1:13
  _next   @   asyncToGenerator.js?1da1:25
  eval    @   asyncToGenerator.js?1da1:32
  eval    @   asyncToGenerator.js?1da1:21
  _mountApp   @   client.js?06a0:693
  mountApp    @   client.js?06a0:693
  Promise.then (async)        
  eval    @   client.js?06a0:96
  eval    @   client.js:1169
  ./.nuxt/client.js   @   app.js:35
  __webpack_require__ @   runtime.js:854
  fn  @   runtime.js:151
  0   @   app.js:861
  __webpack_require__ @   runtime.js:854
  checkDeferredModules    @   runtime.js:46
  webpackJsonpCallback    @   runtime.js:33
  (anonymous) @   app.js:1
  </code></pre>
  
  <p>I know the meaning of the issue, but how can I locate the place? 
  it seems do not give the wrong code location information.</p>
  
  <hr>
  
  <p><strong>EDIT-01</strong></p>
  
  <p>In my <code>layout/default.vue</code>, after I added the <code>&lt;Header/&gt;</code> , it caused the issue.</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;Header&gt;&lt;/Header&gt;
      &lt;nuxt/&gt;
  
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>My Header is like this structure:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="main-body" &gt;...&lt;/div&gt;
  &lt;/template&gt;
  </code></pre>