Vue CLI build and run index.html file without server

Question

I'm using the latest vue-cli version 3.0.

My current issue is that whenever I run npm run build the files generated in the dist folder can't be run without a server.

I would like to be able to just open the index.html file on the browser. How do I go about doing this?

Answer 1

I ran into a similar issue and the following two changes helped me to make it work. Now I can just open index.html in Chrome as a file to run my SPA from file system.

1. In vue.config.js, I did not have a publicPath configured, which resulted in the default "/".
   I had to configure it to empty string like this so that it uses relative paths:

   module.exports = {
       publicPath: '',
   }
   

   ^{PS: Since Vue CLI 3.3 use publicPath instead of the now deprecated baseURL}

2. I was using the history mode of vue-router, which does not work on a local file system to route the paths back to index.html. So I omitted the mode to go back to the default hash mode.