Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Cant run the react app of the theme


I bought the theme from https://themes.getbootstrap.com/product/start-react-bootstrap-5-admin-dashboard-theme/ and get stuck on running the react app:


Failed to compile.

/some-dir/src/_start/helpers/components/KTSVG.tsx
TypeScript error in /some-dir/src/_start/helpers/components/KTSVG.tsx(13,8):
"SVG" 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("/some-dir/node_modules/@types/react-redux/node_modules/@types/react/index").ReactNode".
Type "{}" is not assignable to type "ReactNode".
Type "{}" is missing the following properties from type "ReactPortal": key, children, type, props TS2786

11 | return (
12 | <span className={`svg-icon ${className}`}>
> 13 | <SVG src={toAbsoluteUrl(path)} className={svgClassName} />
| ^
14 | </span>
15 | );
16 | };

node version: v16.13.1
yarn version: 1.22.17


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

Could you please check this thread: https://devs.keenthemes.com/question/metronic-react-demo-3. It should help you.

Regards,
Keenthemes support



Thank for your reply, I get the 404 page when follow the link https://devs.keenthemes.com/question/metronic-react-demo-3



Could you please to the next steps:
1) remove your node_modules folder.
2) update your package.json and yarn.lock files from this gist https://gist.github.com/carmelodevuz/40c32fa5a96d3a64c5f4be20bf44085c.
3) re-install packages with yarn

I hope it should help you. We are working on this issue related to the new React version release. Once the fix will be ready we publish it.


Regards,
Keenthemes support


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(