Images from the static folder are not shown. What could be the reason?

Question

Vue.js

I'm starting to learn naxt and ran into a problem when images are not shown.
In the default.vue template I write a simple code:

<template>
  <div>
    <image src="images/logo.png"/>
    <Nuxt />
  </div>
</template>

The image is in the static/images folder.
And when it starts on localhost:3000, it throws errors:

[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 , or missing . Bailing hydration and performing full client-side render.

Moreover, the picture is visible in the inspector and when viewing the code, and it also opens by a link from the code.

I tried wrapping the image in <client-only></client-only>. The error disappears, but the image is not visible on the page.

Answer 1

I'm stupid, I spelled the tag of the picture incorrectly.
That works correctly
<img src="/images/logo.png" alt="">

Answer 2

Change the path to the image to absolute, from the root:
/images/logo.png