CODEWITHSUNDEEP
vue.jsgithubgithub-pages
Sh031224
Sh031224

Reputation: 809

(Vue.js) How to use github page on 'Vue.js'

I want to use github page on 'vue.js'

I tried to modify /config/index.js file.

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../docs/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../docs'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '',

But i can't use github page.

enter image description here

Upvotes: 1

Views: 273

Answers (1)

VonC
VonC

Reputation: 1327384

This should work: the "Vue.js / Deployment / Platform Guides GitHub Pages/ " documentation simply adds:

If you are deploying to https://<USERNAME>.github.io/<REPO>/, (i.e. your repository is at https://github.com/<USERNAME>/<REPO>), set publicPath to "/<REPO>/".
For example, if your repo name is "my-project", your vue.config.js should look like this:

module.exports = {
  publicPath: process.env.NODE_ENV === 'production'
    ? '/my-project/'
    : '/'
}

toast38coza illustrates that setup in his blog post:

Step 1: Setup the build system to build to /docs

Edit: config/index.js

find ../dist replace with ../docs
change assetsPublicPath: '/', to: assetsPublicPath: './',

Run:

npm run build

You should now have a docs folder in your project. Add and push to GitHub.

Check if those settings work better in your case.

Upvotes: 1

Related Questions