Get 2025 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

All Metronic React Demo build is not working at all.


I need help making the React demo 1 build work.

Right now it just shows the loading page in a split second.

* NO ERRORS in the Browser CONSOLE
* All scripts (JS) are resolving correctly
* Proofs. https://snipboard.io/RN17eH.jpg https://snipboard.io/p7k2bR.jpg

Steps to reproduce.

1. Extracted React -> Demo 1
2. Update vite.config.ts.
a. Change base from default to base: "./"
3. Update package.json
a. Added "homepage": ".",
4. RUN -> npm install
5. RUN -> npm run build
6. RUN -> serve -s dist -l 3001
7. Browse -> localhost:3001

Note:
My System is Windows 11, but I tried doing this using my Debian server with the same result.

I tried another react demo and this is the same issue I encountered.


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,

To remove Metronic relative path from the demo url you can change the base path to "/" instead of "./", our latest project is based on vite, and add homepage to pacakge.json is not needed.

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi,

I tried your suggestion and it is now working! Thanks!

Its quite confusing because there are a bunch of outdated guides on the internet and from your published support. But either way, Thanks again!

Regards,
Bryan



Hi Brayn,

Glad to hear that! Please let us know if you have any further questions on this topic or anything else.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


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  :(