Vue-Cli разрешение xlink: Href в SVG при ссылке в <img src=""> - PullRequest
Новая
       67

Vue-Cli разрешение xlink: Href в SVG при ссылке в <img src="">

1 голос
/ 09 апреля 2019

В моем проекте vue-cli мне нужно ссылаться на svg-файл в теге <img>. Это работает.

Теперь внутри этого svg-файла у меня есть <image xlink:href="..."> - И этот путь не затрагивается и не определяется веб-пакетом.

Пример: 

<!-- MyComponent.vue -->
<img src="@/assets/someImage.svg" />

<!-- someImage.svg -->
<svg ...>
  <!-- none of these are working -->
  <image ... xlink:href="@/assets/arcade-bg-4.jpg"/>
  <image ... xlink:href="~@/assets/arcade-bg-4.jpg"/>
  <image ... xlink:href="./assets/arcade-bg-4.jpg"/>
  <image ... xlink:href="/src/assets/arcade-bg-4.jpg"/>
</svg>

Вопрос теперь в том, как я могу указать веб-пакету определить пути внутри этого файла SVG?

Возможные обходные пути: * положить arcade-bg-4.jpg в /public и указать это в xlink:href * используйте inline- <svg> in MyComponent.vue

Но я бы хотел сохранить тег <img />, а также функцию хеширования файлов из vue-cli.

Справочная информация: Я использую эту настройку, чтобы получить (относительно) кросс-браузерную маску клипа с .jpg вместо .png, которая намного меньше и более производительна.

...