Light
Dark
System
Ask  Question

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
user
maxence millescamps 7 months ago
React Bootstrap 5 Metronic
3 Answers
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)

user
Carmelo D 7 months ago
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
user
maxence millescamps 7 months ago
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
user
Carmelo D 7 months ago
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  :(

Metronic

Go to MetronicDownloadsPurchase MetronicRefunds

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle