@Allan-EN-GB I’m trying to do the same thing, but I fail.
App.vue :
<template>
<div id="q-app">
<router-view />
</div>
</template>
<script>
const appIcons = {
'app:my-icon': 'img:customIcons/my-icon.svg'
}
export default {
name: 'App',
created () {
this.$q.iconMapFn = (iconName) => {
const icon = appIcons[iconName]
if (icon !== undefined) {
return { icon: icon }
}
}
}
}
</script>
my-icon.svg is in public/customIcons (public is at the same level as src)
<q-icon
name="app:my-icon"
@error="logError"
/>
and
<q-icon
name="img:customIcons/my-icon.svg"
@error="logError"
/>
log the same error, including:
target: img.q-icon.notranslate
currentSrc: "http://localhost:8080/customIcons/my-icon.png"
if I try accessing http://localhost:8080/customIcons/my-icon.png, then I get a page with: “Cannot GET /customIcons/my-icon.svg”
Any idea about what I am doing wrong ?
