search

shrpne / vue-inline-svg

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

How to use it with Vue 3 #23

Closed mits87 closed 3 years ago

mits87 commented 3 years ago

Hi,

I'm trying to use this vue-inline-svg component with Vue 3 but I have some problems. In my packages.json I have:

"vue-inline-svg": "^3.0.0-beta.1",

in my main.js file:

import InlineSvg from 'vue-inline-svg';

const app = createApp(App);
app.use(InlineSvg);
app.mount('#app');

and I'm trying to dispatch like that:

<inline-svg :src="require('@/assets/images/logo.svg')" />

but unfortunately it doesn't work. Any errors and no SVG on page.

Some tips?

shrpne commented 3 years ago

VueInlineSvg is distributed as component, not as plugin. So try to register it as component:

app.component('inline-svg', InlineSvg);
mits87 commented 3 years ago

that work for me. Thanks