2

I have run

npm install @heroicons/react

and my package.json looks like this:

"dependencies": {
"@headlessui/react": "^1.6.6",
"@heroicons/react": "^2.0.0",
...

but for some reason I cannot get it to work!

I am still getting this error

Please help me out here. I don't understand what is the issue here?

daemon_2262
  • 23
  • 1
  • 5
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Aug 24 '22 at 06:36

1 Answers1

6

In version 2.0.0, according to the docs, the icons should be imported from:

  • @heroicons/react/20/solid
  • @heroicons/react/24/outline
  • @heroicons/react/24/solid

For example:

import { AcademicCapIcon } from '@heroicons/react/20/solid';
import { BeakerIcon } from '@heroicons/react/24/outline';
import { PlayIcon } from '@heroicons/react/24/solid';

function Preview() {
  return (
    <div>
      <AcademicCapIcon />
      <BeakerIcon />
      <PlayIcon />
    </div>
  )
}
  • Thanks , this was exactly the issue I was facing. Next time I will make it a point to look inside the node_modules folder. – daemon_2262 Aug 30 '22 at 11:14