Как вставлять локальные картинки в Vue3 + ParcelJS 2?
Проект на Vue3, сборщик - Parcel 2.
Не отрисовывается вставляемое изображение, лежащее в локальной папке (roseImg2).
При этом картинка, на которую даётся веб-ссылка(roseImg), отрисовывается без проблем.
Для локальной уже делал и import, и require - суть одна: в лучшем случае вижу вместо картинки alt-текст.
В худшем - пустую вкладку с эррорами в консоли.
Как вставлять картинку, чтобы работало?
Код файла App.vue:
<template>
<div class="container">
<h1>{{ message }}</h1>
<img :src="roseImg" alt="no Image!">
<img :src="roseImg2" alt="no Local Image!"> <!-- HOW ??-->
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
message: 'Using Parcel In A Vue.js App',
roseImg: 'https://img-fotki.yandex.ru/get/5807/136160416.205/0_15fa25_b38668a9_orig.png',
roseImg2: 'fitLogo.png',
};
},
};
</script>
<template>
<div class="container">
<h1>{{ message }}</h1>
<img :src="roseImg" alt="no Image!">
<img :src="roseImg2" alt="no Local Image!"> <!-- HOW ??-->
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
message: 'Using Parcel In A Vue.js App',
roseImg: 'https://img-fotki.yandex.ru/get/5807/136160416.205/0_15fa25_b38668a9_orig.png',
roseImg2: 'fitLogo.png',
};
},
};
</script>фрагмент package.json :
"main": "index.html",
"scripts": {
"dev": "parcel index.html",
"test": "echo \"Error: no test specified\" && exit 1"
},структура файлов:
