All assets are fail to load

[halton]

Environment:

• Node.js: v9.9.0
• vue-cli-ghpages: 1.0.0
• vue: 3.0.0-beta.6

Steps:

1. vue create vue-test
2. Push the code to a github repo, like https://github.com/halton/vue-test
3. vue-cli-ghpages
4. Browse the ghpages https://halton.github.io/vue-test/

Expected result:

• The pages are similar with local build Actual result:
• Blank page and inspector shows all the assets are fail to download

[coderpradp]

FAQ You need to setup relative path during build. Follow these steps:

1. Open up /config/index.js file
2. Change assetsPublicPath: '/' to assetsPublicPath: './'
3. Save, build and deploy

[halton]

Unfortunately, I failed in both cases:

1. Fail to find the config/index.js file on a clean new created VUE repo, https://github.com/halton/vue-test
2. I found config/index.js in another old repo, but your FAQ does not help in advance.

[coderpradp]

Well the config/index.js is only available in some template of vue-cli. You could change the path yourself in index.html file to reference correct assets.

[halton]

Still very confused, could you go to the repo https://github.com/halton/vue-test and ponit me which file should change? This repo is zero change after crating with vue create.

[coderpradp]

Okay you can create vue.config.js file in root of your project. Then insert following line:

module.exports = {
  baseUrl: '/vue-test/',
}

From Official vue-cli docs:

Project deployment base By default we assume your app will be deployed at the root of a domain, e.g. https://www.my-app.com/ If your app is deployed at a sub-path, you will need to specify that sub-path here. For example, if your app is deployed at https://www.foobar.com/my-app/ then change this to '/my-app/'