search

tailwindlabs / heroicons

A set of free MIT-licensed high-quality SVG icons for UI development.
https://heroicons.com
MIT License
21.72k stars 1.28k forks source link

Typescript issue: Cannot find module '@heroicons/react/20/solid' or its corresponding type declarations #886

Closed Shaker-Pelcro closed 2 years ago

Shaker-Pelcro commented 2 years ago

I'm using the latest version (2.0.13). Typescript version is (4.6.4)

I'm using and example from "TailwindUI" premium library, and it gives me this error ... Cannot find module '@heroicons/react/20/solid' or its corresponding type declarations

And this is how I'm importing the icon ...

import { ExclamationCircleIcon } from "@heroicons/react/20/solid";

This is breaking my app. image

reinink commented 2 years ago

Hey! Sorry, not sure what's up here. I just gave this a try myself in a fresh Next.js TypeScript app, and it's working:

image

I am able to view the types for this icon in ./node_modules/@heroicons/react/20/solid/ExclamationCircleIcon.d.ts.

I'm going to close this issue — but please feel free to open a new issue with a minimal reproduction that I can test with, and I'd be happy to have another look 👍

kalnode commented 10 months ago

I encountered a similar issue, found a solution:

Legacy project (always worked): "@heroicons/vue": "^1.0.6" import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/vue/outline'

New project (got error): I started with current version, but same import statement. Error occurred similar to OP. "@heroicons/vue": "^2.1.1" import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/vue/outline'

Works - Changing import statement: import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/vue/24/outline'