How to specify the absolute path to a file from a component?

Question

Vue.js

Hello, tell me why I can't specify the absolute path to the image, which is located in the static(folder in the root of the site) from the component? And if I have components at the 4th nesting level, I will not put ../../../../?

<button @click="openModal">
       <img src="/static/images/icon.svg">
</button>

if I write a relative path , the image sees

<button @click="openModal">
       <img src="../../../static/images/icon.svg">
</button>

Project created with vue cli

Answer 1

Try to enter the symbol ~ or @, for src it starts from the root of the project and then for example '~/public/assets/images/icon.svg'