Неверный путь URL для изображений, использующих Vue.js - PullRequest
Новая
       17

Неверный путь URL для изображений, использующих Vue.js

1 голос
/ 15 марта 2019

Я новичок в Vue.js , и я начинаю новый проект, который динамически загружает изображения различными способами.

При этом я запускаю его через npm run dev и получаю значки сбойного изображения и следующую ошибку в журнале консоли: 

GET http://localhost:8080/@/assets/images/myimage.svg 404 (Not Found)

Вот фрагмент моего кода, который идет внутри цикла и использует функцию, которая возвращает путь к изображению внутри SVG: 

container.insertAdjacentHTML('afterbegin', `<image xlink:href="${setItem(i).filePath}" x="${x}" y="${y}" width="16" height="16"/>`)

У меня есть несколько изображений, которые также загружаются с и без функции, которая возвращает свой путь, но не внутри SVG: 

<image src="${setItem(i).filePath}" alt="">
<image src="@/assets/images/myimage.svg" alt="">

Как я уже сказал, все изображения повреждены . Пожалуйста, что я делаю не так?

P.S .: Не стесняйтесь предлагать редактирование названия для лучшего понимания вопроса.

1 Ответ

0 голосов
/ 15 марта 2019

Импорт относительного пути

Когда вы ссылаетесь на статический ресурс, используя относительный путь (должен начинаться с.) В файлах JavaScript, CSS или * .vue, актив будет включен в граф зависимостей веб-пакета.Во время этого процесса компиляции все URL-адреса активов, такие как background: url (...) и CSS @import, разрешаются как зависимости модуля.1007 * с ./...

документы

...