Closed alesssz closed 10 months ago
I am not able to reproduce the issue, can you provide a minimal reproduction?
I am not able to reproduce the issue, can you provide a minimal reproduction?
Digging out what's wrong, I found out that the interations with @fortawesome/fontawesome-free
is causing that error, but I honestly don't know why.
Using the regular font awesome (from Font Awesome Vue with their imports is working well (but I didn't want to set up a library.add
for each icons, that's why I tried to use @fortawesome/fontawesome-free
)
This is the reproducable thing, i tried to build a brand new project with Vue CLI and copy and paste all the code above (installing modules like @fortawesome/fontawesome-free
, bootstrap
, vue-router
and obviously vue-sidebar-menu
) and the interaction with @fortawesome/fontawesome-free
is causing the error. Removing that make the icons to disappear, but the collaspe button is working again
Remove @fortawesome/fontawesome-free/js/all.js
but i recommend to use the vue component, you can also import all the icons
// main.js
import { library } from '@fortawesome/fontawesome-svg-core'
import { fas } from '@fortawesome/free-solid-svg-icons'
library.add(fas)
// SideBarMenu.vue
import { h } from 'vue'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
const faIcon = (props) => {
return {
element: h('div', [h(FontAwesomeIcon, { size: 'lg', ...props })]),
}
}
...
{
href: '/',
title: 'Dashboard',
icon: faIcon({ icon: 'fa fa-user' }),
}
That works perfectly! Thank you!
I'm getting an error when i try to collapse the menu.
I got this in my
main.js
in
App.vue
And in the
SideBarMenu.vue
componentIm getting this error
Uncaught (in promise) DOMException: Node.insertBefore: Child to insert before is not a child of this node
when I try to collapse the menu with the button in the footer.
How to resolve this?