Ant-design-pro: Serve page on github-pages

[stasbar]

Hello, I have problem serving my app on gh-page.
In development mode everything works fine. In production environment (I'm hosting on gh-pages) I can't visit my sub-pages directly. That is I can't go directly to e.g. https://preview.pro.ant.design/dashboard/analysis because it throws me github 404 page. Instead I have to go first to https://preview.pro.ant.design, and then to the dashboard/analysis through umi router. I've copied the exact config that this project has, but it still doesn't work. How does the https://preview.pro.ant.design solved this issue ? It looks like it's hosted on gh-pages as well https://github.com/ant-design/ant-design-pro/tree/gh-pages .
And it doesn't use history : { type: 'hash' } how did they achieve it ?

[gbaranski]

Hi, I've got the same problem with my app.

[huntdream]

Check this Deploy to a non-root directory

[stasbar]

Check this Deploy to a non-root directory

Where does the ant-design-pro in it's config uses the base or publicPath fields?

[huntdream]

Check this Deploy to a non-root directory

Where does the ant-design-pro in it's config uses the base or publicPath fields?

Try put those two fields into the object inside defineConfig

[stasbar]

I'm using custom domain web.vapetool.app with gh-pages, so the base and publicPath are both /

[christopherkao]

@stasbar I've tried setting in config.js:

export default defineConfig({
  base: '/',
  publicPath: '/',
...
}

After building and re-deploying to Github Pages, my site at http://finances.fyi/home-mortgage still returns the Github 404 error.

[huntdream]

@stasbar Working on this issue for several hours 🤣 , finally find that the dist build from official repo will generate a 404.html, while project created by npm create umi doesn't generate it.
And Github Pages support custom 404 page if add a 404.html or 404.md docs
So they use the custom 404.html to initialize the app when try to access nonexistent pages

[huntdream]

And I created a demo, it works well

[christopherkao]

@huntdream I'm confused. Are you saying that you fixed the problem? Was the solution to just add a 404.html or 404.md file in the /dist folder?

Does that mean that every time we run npm run build we will have to manually copy that 404 file over?

[huntdream]

@huntdream I'm confused. Are you saying that you fixed the problem? Was the solution to just add a 404.html or 404.md file in the /dist folder?

Does that mean that every time we run npm run build we will have to manually copy that 404 file over?

Yes, you just need to add a custom 404.html to override the default 404 page of Github Pages
I think you can just cp index.html 404.html

[chenshuai2144]

try this plugin
https://github.com/umijs/umi-plugin-gh-pages