N
N
notequal212022-02-23 19:59:30
Sprites
notequal21, 2022-02-23 19:59:30

How to make and connect SVG sprites for vue?

You need to make an svg sprite and connect it to vue.
The project uses vue 3 and typeScript.
How to do it better?
Perhaps there is some kind of plugin convenient?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
I
InfernoElegy, 2022-02-24
@InfernoElegy

Currently, when there is http2 from sprites, there is not much sense, especially from svg sprites.
The best way would be inline svg, but to make it more convenient, there is vue-svg-loader

A
Alexander, 2022-02-26
@Aleksandr-JS-Developer

Projects are very different.
For example, we use a sprite (video platform) because there are a large number of repeating sprites on a page (any).
Inlining is not an option for us at all - problems with the cache.
You really don’t need to bother with a sprite because of one or two icons, but when there are a lot of them, then the inline will be an unnecessary shot in the foot.
When combined with a convenient component, it becomes easier to live.

<sprite
  name="user-icon"
  :fill="isAuthed ? '#0097A7' : '#c2c2c2'"
/>

And put the svg themselves into the svg folder in assets, from where the collector itself generates a sprite from the actual svg`s

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question