ant-design-icons: Error using @ant-design/icons with TypeScript

Lately I have problem using icons with @ant-design/icons. It seems like this issue has been there for a while, but only a few people have encountered it.

I tried the solution @lukasluecke suggested in #304, which is to install @types/react and @types/react-dom directly to the project. But it does work for my situation. Any other suggestion on solving

package.json

"dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.29",
    "@fortawesome/free-solid-svg-icons": "^5.13.1",
    "@fortawesome/react-fontawesome": "^0.1.11",
    "@microsoft/sp-core-library": "1.10.0",
    "@microsoft/sp-lodash-subset": "1.10.0",
    "@microsoft/sp-office-ui-fabric-core": "1.10.0",
    "@microsoft/sp-property-pane": "1.10.0",
    "@microsoft/sp-webpart-base": "1.10.0",
    "@pnp/common": "^2.0.6",
    "@pnp/graph": "^2.0.6",
    "@pnp/logging": "^2.0.6",
    "@pnp/odata": "^2.0.6",
    "@pnp/sp": "^2.0.6",
    "@pnp/telemetry-js": "^2.0.0",
    "@reduxjs/toolkit": "^1.4.0",
    "@types/es6-promise": "0.0.33",
    "@types/react": "16.8.8",
    "@types/react-dom": "16.8.3",
    "@types/webpack-env": "1.13.1",
    "antd": "^4.4.1",
    "office-ui-fabric-react": "6.189.2",
    "react": "16.8.5",
    "react-dom": "16.8.5",
    "react-highlight-words": "^0.16.0",
    "react-redux": "^7.2.0",
    "react-router-dom": "^5.2.0",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0"
  },
  "resolutions": {
    "@types/react": "16.8.8"
  },
  "devDependencies": {
    "@microsoft/rush-stack-compiler-3.3": "0.3.5",
    "@microsoft/rush-stack-compiler-3.7": "^0.5.2",
    "@microsoft/sp-build-web": "1.10.0",
    "@microsoft/sp-module-interfaces": "1.10.0",
    "@microsoft/sp-tslint-rules": "1.10.0",
    "@microsoft/sp-webpart-workbench": "1.10.0",
    "@types/chai": "3.4.34",
    "@types/mocha": "2.2.38",
    "@types/react-redux": "^7.1.9",
    "@types/react-router-dom": "^5.1.5",
    "ajv": "~5.2.2",
    "gulp": "^3.9.1"
  }

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 3
Comments: 16

Most upvoted comments

Add these two: onPointerEnterCapture={undefined} onPointerLeaveCapture={undefined}

+12

sohail-amini on Mar 17, 2024

@lfpkkk it doesn’t work as followed your steps. I just use the icon with default props, but it warned.

is there any other ways to fix?

antstudio-git on Apr 6, 2021

"react": "17.0.2",
"react-dom": "17.0.2",
"@types/react": "17.0.65", // upgrade
"@types/react-dom": "17.0.20", // upgrade
"antd": "^5.9.0",

Upgrade types version works for me

PWbio on Sep 13, 2023

<CaretRightOutlined rev={“”} rotate={isActive ? 90 : 0} />}> add rev property it will fix

Pankajsyal1 on Jul 30, 2023

https://github.com/ant-design/ant-design-icons/issues/483#issuecomment-1337294734

eminoda on Dec 5, 2022

@linonetwo After weeks of research, I finally noticed that @types/react and @types/react-dom are listed under devDependencies in package.json by default, but in my project they were moved under dependencies somehow. So my final solution to this issue is to move them back to devDependencies, of course with the latest version number, and then reinstall the whole node modules by npm intall.

Hope this is helpful for solving your issue as well.

lfpkkk on Sep 2, 2020

I have already upgrade versions but still get error

Check out my comment for details; screenshots https://github.com/ant-design/ant-design-icons/issues/483#issuecomment-1779061345

dizefurkan on Oct 25, 2023