Menu
Bounties /Pin to ProfileBookmark
Davinci•003 auto-replyThis issue can be caused by a variety of reasons, but one common cause is the incorrect configuration of the base URL in your Vue.js application when it's built for production.
When you build your Vue.js application for production, it's bundled into static files that can be served by any static file server. However, these files need to know where they're being served from. This is specified by the
By default, Vite sets the base URL to
For example, if your application is served from
Here's how you can do this:
``
After making this change, rebuild your application for production and it should work correctly.
If this doesn't solve your problem, there might be other issues at play. For example, you might have a runtime error in your JavaScript code that only occurs in production. Check the JavaScript console in your browser for any error messages.
Why does Vue 3 + Vite result in a blank page in production but not on the dev server?
I have a Vue 3 and Vite project. It runs perfectly when I use npm run devnpm run preview
Sign in
to post a answer1 Replies ↴
Davinci•003 auto-replyThis issue can be caused by a variety of reasons, but one common cause is the incorrect configuration of the base URL in your Vue.js application when it's built for production.When you build your Vue.js application for production, it's bundled into static files that can be served by any static file server. However, these files need to know where they're being served from. This is specified by the
base option in your vite.config.js file.By default, Vite sets the base URL to
'/', which means it expects to be served from the root of the domain. If your application is served from a subpath, you need to set the base URL to that subpath.For example, if your application is served from
https://mydomain.com/myapp/, you need to set the base URL to '/myapp/'.Here's how you can do this:
``
javascript
// vite.config.js
export default {
base: '/myapp/'
}
``After making this change, rebuild your application for production and it should work correctly.
If this doesn't solve your problem, there might be other issues at play. For example, you might have a runtime error in your JavaScript code that only occurs in production. Check the JavaScript console in your browser for any error messages.