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

How to export the project


Hi, im using demo1 app for my personal use, i downloaded it and made a lot of changes(added new pages etc)
So Im trying to export this project for publish
vite.config.ts file
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react-swc'

// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
base: "/metronic8/react/demo1/",
build: {
chunkSizeWarningLimit: 3000,
},
})
Then I run this command
npm run build
..
dist/assets/WidgetsPage-bb75ee96.js 193.01 kB │ gzip: 14.57 kB
dist/assets/index-ec788f2a.js 2,700.60 kB │ gzip: 744.17 kB
✓ built in 27.99s
it gots success, but in dist/index.html file is almost empty, can see anything but
Keenthemes dark logo Keenthemes light logo
Loading...
this,

I can see everything with this command
npm run preview


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 (9)


Hi,

Thank you for reaching out to us.

It sounds like you are trying to deploy your application, to test the production build locally you should run npm run build to build an application, the build output will be placed in dist folder in the root of your project, then to preview production build you can run npm run preview. Later dist folder can be deployed to our server.

By default, our previews are served under /metronic8/react/demo1/, when you deploy Metronic on your server, you should update base property up to the path on your server in file vite.config.js. If you do not have a nested folder on your server then you can set base path to /.

You can read more about this property in the official documentation: https://vitejs.dev/guide/build#public-base-path.

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi, I tryed this
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";

// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
base: "/",
build: {
chunkSizeWarningLimit: 3000,
},
});


it exports himself but, index.html is not shows anything, how can I share screenshot, I need helpimport { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";

// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
base: "/",
build: {
chunkSizeWarningLimit: 3000,
},
});
I uploaded the ss with lightshot

https://prnt.sc/4Tq4yfnT3bee

https://prnt.sc/WioA8Bqq8N6T



Hi,

Thank you for reaching out to us.

You cannot open index.html due to the way modern JavaScript frameworks handle development and deployment.

For the development to run the application you have to use the command npm run dev, for production use npm run build.

Regards,
Lauris Stepanovs,
Keenthemes Support Team



You cannot open index.html due to the way modern JavaScript frameworks handle development and deployment.
I'm trying this after the deployment



I really need help, can we connect ?



Please check this out

https://keremmm.netlify.app/



Hi,

It looks like your application just refers to the index.html file directly, which is not correct. Please see this official guide on how you can deploy Vite Vue application to Netify.
https://vitejs.dev/guide/static-deploy#netlify

Regards,
Lauris Stepanovs,
Keenthemes Support Team



ailed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.



Hi,

Unfortunately, we were not able to reproduce this error in the latest Metroinc 8 version.

You can try solution suggested in this post: https://stackoverflow.com/questions/75433591/failed-to-load-module-script-expected-a-javascript-module-script-but-the-server

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