Deployment of a react app stopped working on GitHub pages - reactjs

I am doing a React app which I deploy on GitHub pages. https://asaroz.github.io/DCI_Hackathon_TeamE
Deployments worked without much problems before, but now the console gives me this:
the path to the file seems to be correct:
I deploy with the npm module from GitHub pages.
{
"homepage": "http://asaroz.github.io/DCI_Hackathon_TeamE/",
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.4",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"bootstrap": "^5.1.3",
"node-sass": "^6.0.1",
"react": "^17.0.2",
"react-bootstrap": "^2.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"react-simple-image-slider": "^2.3.0",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^3.2.3"
}
}
I sadly have no clue what the exact problem is. Perhaps the Response gives me a hint, but I just don't know that much about Response errors jet. Thanks in advance.

Ok github pages didn't update/deploy my changes. I don't know why. I fixed the issue by editing a useless space into the file in question on github.

Related

Tried uploading my react project to github pages but when clicked on it shows me an incorrect page

tried uploading react project and it directs me to this other page.
enter image description here
the image above is what happens when i click on githu pages.
the following is my package json file,
I tried npm run deploy but it doesnt do nothing to the github page.
{
"name": "leslie-creations",
"version": "0.1.0",
"private": true,
"homepage": "https://jflo25.github.io/CreationsByLeslie/",
"dependencies": {
"#emotion/react": "^11.10.5",
"#emotion/styled": "^11.10.5",
"#material-tailwind/react": "^1.2.5",
"#mui/icons-material": "^5.11.0",
"#mui/material": "^5.11.3",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-icons": "^4.7.1",
"react-router-dom": "^6.6.1",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^4.0.0",
"tailwindcss": "^3.2.4"
}
}
tried changing the homepage to "homepage": "https://jflo25.github.io" but when i do so and run npm run deploy it doesn't seem to do anything. Any suggestions on how i can fix this or just start over with a new repo? This my first time trying to upload a react project through vs code terminal and cant figure it out.

unable to deploy react app to github pages displaying readme file

I'm currently trying to deploy my react app toGitHub Pages, but I'm receiving a 404 error or not loading the app. Everything runs fine on my local host. I'm not too sure if this is the problem, but I think I'm not properly calling my app or root from the index.html. Also I'm not sure if this is the problem.
Here is my github page https://github.com/mohbadrus/badrus.github.io
here is my package.json
{
"homepage": "http://badrus.github.io",
"name": "clown-web",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"bootstrap": "^5.2.3",
"bootstrap-icons": "^1.10.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^4.0.0"
}
}

404 error deploying reactjs app on github pages to a custom domain

I am getting 404 errors loading my react js app Ive deployed through github pages. I added a custom domain and I was getting DNS errors but ive resolved them and Im still unable to load the page. Im not sure what Ive done wrong.
To deploy to github pages I ran : npm run deploy
Then I added my custom domain and resolved the errors by adding the github IP addresses to the A records as shown in the documentation :
185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153
The errors Im seeing in the console are all on the .js, .css and manifest.json files. And my DNS check has been successful, Im not sure how to find whats gone wrong.
My package.json looks like this:
{
"homepage": "http://CRJones7.github.io/learned",
"name": "learned",
"version": "0.1.0",
"private": true,
"dependencies": {
"#primer/octicons-react": "^17.9.0",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"bootstrap": "^5.2.3",
"jquery": "^3.6.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.4.4",
"react-scripts": "5.0.1",
"reactstrap": "^9.1.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^4.0.0"
}
}
{
"homepage": "http://CRJones7.github.io/learned",
"name": "learned",
"version": "0.1.0",
"private": true,
"dependencies": {
"#primer/octicons-react": "^17.9.0",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^13.5.0",
"bootstrap": "^5.2.3",
"jquery": "^3.6.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.4.4",
"react-scripts": "5.0.1",
"reactstrap": "^9.1.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^4.0.0"
}
}
My errors look like this:

Can not deploy react js website by git hub [duplicate]

This question already has answers here:
Error with Permissions-Policy header: Unrecognized feature: 'interest-cohort'
(3 answers)
Closed last year.
I have just started react. My page works fine on localhost.
Now I am trying to host my page on github. I have used "npm run deploy" but it doesn't work. it appears 2 errors:
Error with Permissions-Policy header: Unrecognized feature: 'interest-cohort'.
You need to enable JavaScript to run this app.
This is my package.json
{
"homepage": "http://khanh0709.github.io/dolla",
"name": "dolla",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.2",
"#testing-library/react": "^12.1.2",
"#testing-library/user-event": "^13.5.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-icons": "^4.3.1",
"react-router-dom": "^6.2.1",
"react-scripts": "5.0.0",
"react-scroll": "^1.8.4",
"styled-components": "^5.3.3",
"web-vitals": "^2.1.4"
},
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^3.2.3"
}
}
Maybe these are not error. I have wait visual studio deploy it for 1 hour. And, it work

Github Pages React App Blank Page & Returning 404

I've been looking at many forums for a solution but haven't found any. I'm not sure what I'm doing wrong.
I'm using react and styled components to create a website on GitHub Pages, but i keep getting a blank page and a 404 error in the console which is:
"Failed to load resource: the server responded with a status of 404 ()"
"main.79bf5a2e.js"
My repository: https://github.com/Visibyte/Space-Tourism
My package.json
{
"homepage": "https://visibyte.github.io/space-tourism",
"name": "space-tourism-react",
"version": "0.1.0",
"private": false,
"dependencies": {
"#testing-library/jest-dom": "^5.16.1",
"#testing-library/react": "^12.1.2",
"#testing-library/user-event": "^13.5.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router": "^6.2.1",
"react-router-dom": "^6.2.1",
"react-scripts": "5.0.0",
"web-vitals": "^2.1.2"
},
"scripts": {
"start": "react-scripts start",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"gh-pages": "^3.2.3",
"styled-components": "^5.3.3"
}
}
Any help would be much appreciated, thanks.

Resources