We are trying to deploy the version 0.1.0 of our Routing Solid App made with the Inrupt solid-react-generator.
Running it in local, it works perfectly; but when we try to deploy it at GHPages, it does not find any resource in our public folder nor is able to resolve links, the deployed app: https://arquisoft.github.io/viade_en1a/
Have you tried using different homepage values in your package.json? I’d try it with a slash at the end. Currently some paths seem broken (e.g. https://arquisoft.github.io/img/bars-nav.svg). But idk if that is related to your issue.
They say that is supposed to be used assuming ur hosting the app at the server root and you should override that specifying the actual homepage, as we had: “homepage”: “…hub.io/viade_en1a”
Anyay, i will try that right now.
Tank you a lot!
Don’t know if this could help as I’m working with lit-elements instead of react, but
I use this webpack config file https://github.com/scenaristeur/salut/blob/master/webpack.config.js that build all my code in a dist folder as a single file that is been called in my /dist/index.html.
In my repo config, I’ve set my gh-pages to gh-page branch.
On local repo
I 've commented the /dist folder in my .gitignore file.
And initialised gh-page branch
To develop on local, I use npm run start
When I want to publish, I run npm run build that build my src folder to /dist folder.
See my package.json to add that command to yours and check if you have all dependencies.
Then I push master branch as normal.
Then I use this command to push the dist folder to gh-page branch
git subtree push --prefix dist origin gh-pages
Waiting some minutes that GitHub take it in account and the magic appears…
I’m not sure how locales and those images are loaded in your app, but the relevant documentation there would be Using the Public Folder. (Though also note that that recommends importing them as objects.)
Perhaps @james.martin has more insight here, since he works on the Generator?
Y, we found that importing images as objects they can be loaded, but we got no idea where to import locales as objects.
If we run the app locally, everything works perfectly.
However, the deployed app tries to find resources at arquisoft.github.io/..., while our resources are located at arquisoft.github.io/viade_en1a/... (the public folder of our repo, https://github.com/arquisoft/viade_en1a).
I don’t know how to fix it, but I’m pretty confident that GH Pages isn’t the problem. Even locally (after setting homepage to . and removing public_url and start_url like here¹) it always uses absolute paths (or relative to the root, not sure what the correct term is), leading to 404 requests (you can try it by building it locally, serving your project directory locally¹ and then visiting http://localhost:5000/build/).
I will take a closer look, but I only have limited time so don’t expect much. If you haven’t tried it out yet, does it work to build the template and serve it without 404s? (or in other words: did a change you made during development cause this issue or is it an issue of the solid-react-generator?)
And I’d suggest you to look over it and check if it works properly. I only quickly did it without checking if it breaks other things because of time constraints. But I hope it helps you with the project