search

shrpne / vue-inline-svg

Dynamically loads an SVG source and inline <svg> element so you can manipulate the style of it
MIT License
177 stars 22 forks source link

Link to svg in src #47

Closed Ursyyy closed 1 year ago

Ursyyy commented 1 year ago

Hello, I have been using the module in my project for a long time and there are no problems with local svg images. But recently there was a need to use pictures on another resource. In the documentation, I did not find a detailed description of whether it is possible to use a link to svg like "http://service.com/path/to/image.svg" in :src and whether it is possible to use other images, such as png and jpg

shrpne commented 1 year ago

Hello!

But recently there was a need to use pictures on another resource.

Loading content of SVG files from another origin can be blocked by the browser due to CORS policy.

whether it is possible to use other images, such as png and jpg

The purpose of vue-inline-svg is to download XML markup of SVG file and inline it into the HTML (to style such SVG with CSS or to manipulate such SVG with JS later). PNG or JPG files don't have XML markup inside, they are binary files, so their content can't be inlined into HTML markup.

So just use <img> tag for png and jpg images.

Also if you don't need to inline your svg's you can use <img> for svg too, it will fix CORS issues

Ursyyy commented 1 year ago

Thanks)