DEV Community


Discussion on: host vue js build app

rahulshaw_dev profile image
Rahul Shaw

I will suggest you to do the following steps:
1) install serve package globally with npm ( npm install -g serve )
2) Go to your project directory and create the dist file using npm run build
3) Then in the command line write serve -s dist ( The dist folder you need to upload )
4) It will open in localhost:5000 and check whether the website is showing properly or not

arabelhousseyn profile image
elhousseyn arab Author • Edited

i just solve the problem so the problem it was in the routing i was deploying my vue js app on folder on the server and that is not correct for single page app because the default route / it needs to be in the main directory on the server so the solution is to create subdomain and put your vue app so your vue app it's in main directory of the subdomain that's the following subdomain
but there is another problem when i try to access to expect route example :
it show me a 404 error but if use router.push it takes me to this route and show me the components but if i refresh the page it show me the 404 error
the vue app it relies on vue route push not for browser caching solution for this is to add this htaccess for index.html

RewriteEngine On
RewriteBase /
RewriteRule ^index.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]