Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

davemaxwell's avatar

Importin Heroicons in Vue 3 project

I need to use the Heroicons for Vue js in my project, I have installed it as recommended in the https://vue-hero-icons.netlify.app/ page npm i @vue-hero-icons/outline @vue-hero-icons/solid. However, if I import the Icon like below, I get an error Homeicon is declared but its value is never read

import { createStore } from 'vuex'
import { HomeIcon } from "@vue-hero-icons/outline"
export default createStore({
  state: {

    navigation: [
      
      {
        title: "Home",
        icon: "HomeIcon",
        url: "/"
    },

Please, I need an idea of what to do next. Thanks.

0 likes
1 reply
piersblack's avatar

Hello,

The issue here is that you need to call it inside the template tag itself. So inside the template tag you should have the following: <HomeIcon class="" />

1 like

Please or to participate in this conversation.