TypeScript Error
Jeniczech opened this issue · comments
Hello there,
I have been using your library for ages, but all of the sudden, I am getting this weird TS error:
TS2786: 'SVG' cannot be used as a JSX component. Its instance type 'InlineSVG' is not a valid JSX element.
Do you, please, have any idea what might be causing the error?
My package.json:
"dependencies": {
"@dnd-kit/core": "^5.0.1",
"@dnd-kit/modifiers": "^5.0.0",
"@dnd-kit/sortable": "^6.0.0",
"@types/file-saver": "^2.0.1",
"@types/html2canvas": "^0.0.36",
"@types/i18next": "^13.0.0",
"@types/lodash": "^4.14.165",
"@types/moment": "^2.13.0",
"@types/react-beautiful-dnd": "^13.0.0",
"@types/react-i18next": "^8.1.0",
"@types/react-redux": "^7.1.9",
"@types/react-router": "^5.1.18",
"autoprefixer": "^9.8.5",
"bootstrap": "4.4.1",
"core-js": "^3.6.4",
"file-saver": "^2.0.2",
"html-to-image": "^1.7.0",
"i": "^0.3.6",
"i18next": "^19.6.2",
"lodash": "^4.17.20",
"moment": "^2.27.0",
"npm": "^6.14.9",
"rc-slider": "^10.0.0-alpha.4",
"react": "^16.12.0",
"react-beautiful-dnd": "^13.0.0",
"react-datetime": "^3.0.4",
"react-dom": "^16.12.0",
"react-i18next": "^11.7.0",
"react-inlinesvg": "^2.0.1",
"react-redux": "^7.2.0",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-toastify": "^5.5.0",
"redux": "^4.0.5",
"regenerator-runtime": "^0.13.3",
"xlsx": "^0.16.8"
},
"devDependencies": {
"@babel/core": "^7.8.3",
"@babel/preset-env": "^7.8.3",
"@babel/preset-react": "^7.8.3",
"@babel/preset-typescript": "^7.8.3",
"@types/react": "^16.9.43",
"@types/react-dom": "^16.9.5",
"@types/react-router-dom": "^5.1.5",
"@typescript-eslint/eslint-plugin": "^3.7.0",
"@typescript-eslint/parser": "^3.7.0",
"babel-loader": "^8.0.6",
"babel-plugin-module-resolver": "^4.0.0",
"css-loader": "^3.4.2",
"eslint": "^7.5.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-react": "^7.20.4",
"eslint-plugin-react-hooks": "^4.0.8",
"file-loader": "^6.0.0",
"html-webpack-plugin": "^3.2.0",
"node-sass": "^4.13.1",
"postcss-loader": "^3.0.0",
"resolve-url-loader": "^3.1.1",
"sass-loader": "^8.0.2",
"source-map-loader": "^0.2.4",
"style-loader": "^1.1.3",
"stylelint": "^13.6.1",
"stylelint-config-standard": "^20.0.0",
"stylelint-scss": "^3.18.0",
"ts-loader": "^6.2.1",
"typescript": "^3.7.5",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.1"
}
}
hey @Jeniczech
This isn't an issue with the library and it's nearly impossible to know what is happening in your project.
Good luck.
i also got this error now. couldn't remember that i got this before
'InlineSvg' cannot be used as a JSX component.
Its instance type 'InlineSVG' is not a valid JSX element.
The types returned by 'render()' are incompatible between these types.
Type 'React.ReactNode' is not assignable to type 'import("xxxx/node_modules/@types/react-transition-group/node_modules/@types/react/index").ReactNode'.
Type '{}' is not assignable to type 'ReactNode'.ts(2786)
I have the same problem
i have same problem :(
how to fix this