How can one deploy a create react app to gh-pages?
My packages.json folder has my homepage listed exactly as this: "homepage": "https://mgcraig78.github.io/RoboFriends",
However, the app will not deploy to gh-pages, and when I enter npm run build, the terminal tells me this (which I'm assuming is the issue, but I can't figure out how to fix it): The project was built assuming it is hosted at /RoboFriends/. <- this obviously is not the homepage I have entered into my packages.json file.
Remove the /RoboFriends from your homepage link in package.json to:
"homepage": "https://mgcraig78.github.io"
Then run
npm run build
What you deploy to github is what's inside the build folder that contains index.html
Related
I have deployed my app at https://hudsonbasso.com/ and it is just showing the readme instead of what is showing on my branch when run locally. I suspect is something with the build folder or gh-pages not recognizing my index.js in the src folder. Link to repo https://github.com/hbasso/wherecaniwatch
enter image description here
I ended up solving this by adding a .nojekyll file and following some of the instructions here https://jiafulow.github.io/blog/2020/07/09/create-gh-pages-branch-in-existing-repo/ to create an empty branch called 'gh-pages' and then my yarn deploy worked!
I'm trying to deploy a project so I did an npm run build and after it to check it I did serve -s build.
but when I'm checking the building one I get a blank page but in the regular project(not build), it is working fine.
I tried to see if its a problem of routing but didn't found.
Repo
I deployed it anyway so you can see.
Deploy of blank Page
In Package.json
Replace from
"homepage": "http://ethanolle.github.io/coca-cola"
to
"homepage": "."
I have an issue where I deploy my React app the images are not showing. Works fine locally. I've set the homepage to a GitHub site http://ryandixon555.github.io/react-board-game and run
npm build
then
npm deploy
but still no images. I've also specified the homepage in the package.json:
"homepage": "http://ryandixon555.github.io/react-board-game"
In the end I gave up and deployed using netlify, following this link and then copying my code over.
I've grabbed this example ReactJS project > https://github.com/alik0211/pokedex to experiment with Azure devops. When I build the project locally and use npm start in the build folder the app works fine. This is the path for a file http://localhost:3000/static/js/0.chunk.js`.
But on my Azure environment http://pokedeks.azurewebsites.net/ the server is looking for http://pokedeks.azurewebsites.net/pokedex/static/js/2.c662eb5c.chunk.js. Notice that the `/pokedex/ folder has been added to the path. I'm unsure why this is happening.
I can reproduce it locally by running serve in the build folder instead of npm start: http://localhost:5000/pokedex/static/js/2.a7ba4e0c.chunk.js
I've tried adding npm start to my tasks in the release pipeline but that's also causing errors. So I think the fastest way is to figure out why when using serve the /pokedex/ folder gets added to the routes?
I fixed the issue by replacing the homepage value in my package.json from "homepage": "https://alik0211.github.io/pokedex/", to "homepage": "./", now when I run serve the paths to the files are correct.
I have an app which I'm deploying to gh-pages with npm gh-pages package
I do this command "deploy": "npm run build && gh-pages -d build" it creates build folder normally.
But when I go to gh-pages it is rendering only one static component. You can see here
In networks I can see that resources are loading up, js files, css files.
I'm not sure what the problem is. Can it be because I'm using react router?
All the help will be much appreciated.
Full code can be found here link
The problem is that you are hosting your React App in a subdirectory, which means that your route "/" is not valid here anymore.
Add the homepage property in your package.json file.
"homepage": "https://kiraburova.github.io/Marvel-ReactJS-API/",