Start project with Vitejs + Reactjs + Metronic 8

Hello,

I am a french beginner developer and I have purchase a metronic license.
For a project, I really need to use vite js, react js and metronic 8.

I am aware that you have not integrated react with metronic 8, but now I am really lost and inexperienced...

I have been trying for 1 week now, but unfortunately without success...

I tried to start from a vite project with a react template and to integrate metronic 8.
I tried to start from the demo1 react provided by metronic 8 and to migrate to vite.

Starting from a vite project with a basic react template and I would just like to know which dependencies, folders and files are mandatory to make the application work and start using the features of metronic.

Thanks in advance and sorry for the inconvenience

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,

Our application is based on Create React App, which uses webpack under the hood (not vite).
Try to check this article about moving CRA to vite https://cathalmacdonnacha.com/migrating-from-create-react-app-cra-to-vite

Regards,
Keenthemes support

Hello,

Thank you for your answer, it helped me a lot.

I would like to know if it is possible to move the "media" folder that is in "public".
(for example put it in the "src" folder)
If yes, which file should I modify to change its path

Thanks in advance

Try to check src/_metronic/helpers/AssetHelpers.ts for basic images and background. For the svgs, you have to fix src/_metronic/helpers/components/KTSVG.tsx file.

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