This is my first time deploying onto GH Pages and it seemed like everything was right. It states "Your site is published at https://shayanvalaie.github.io/portfolio/" but after going to the address it gives me a getting started with react page.
After doing some research I found that it might be due to the fact that it is taking my master branch and the solution was to change to the gh-pages branch but after checking it seems I don't have a gh-pages branch.
This is my package.json
"homepage": "https://shayanvalaie.github.io/portfolio/",
"name": "portfolio",
"version": "0.1.0",
"private": true,
"dependencies": {
"#fortawesome/fontawesome-svg-core": "^1.2.36",
"#fortawesome/free-brands-svg-icons": "^5.15.4",
"#fortawesome/free-solid-svg-icons": "^5.15.4",
"#fortawesome/react-fontawesome": "^0.1.15",
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^12.8.3",
"bootstrap": "^5.1.3",
"emailjs-com": "^3.2.0",
"gh-pages": "^3.2.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-hook-form": "^7.17.5",
"react-particles-js": "^3.5.3",
"react-scripts": "4.0.3",
"react-typed": "^1.2.0",
"tsparticles": "^1.36.0",
"web-vitals": "^1.1.2"
},
"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": {
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"prettier": "^2.4.1"
}
}```
I found the solution. I was following a botched tutorial and it missed the step where I need to run "npm run deploy".
Related
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.
I've been trying to deploy a React App to Github Pages, and have followed a few tutorials, however I can't seem to find the gh-pages branch that the site gets built from, only the master branch shows up.
When I deploy the app, only the README.md file shows up, or I get a 404 error. My package.json looks like this:
{
"name": "portfolio",
"homepage": "https://samarqureshii.github.io/",
"version": "2.0.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#mui/icons-material": "^5.6.2",
"#mui/material": "^5.6.3",
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^11.2.7",
"#testing-library/user-event": "^13.1.9",
"ajv": "^8.11.0",
"classnames": "^2.2.6",
"moment": "^2.29.4",
"node-forge": ">=1.3.0",
"object-path": "^0.11.8",
"postcss": "^8.4.14",
"postcss-normalize": "^10.0.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.3.0",
"react-scripts": "^5.0.1",
"sass": "^1.54.5",
"typescript": "^4.7.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"
},
"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"
}
}
I have been trying to implement electron and react together ,with the below package.json
{
"name": "loader",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.3.0",
"#testing-library/user-event": "^13.5.0",
"cross-env": "^7.0.3",
"electron-is-dev": "^2.0.0",
"react": "^18.2.0",
"react-countup": "^6.3.1",
"react-dom": "^18.2.0",
"react-icons": "^4.4.0",
"react-idle-timer": "^5.4.2",
"react-loader-spinner": "^5.3.3",
"react-rnd": "^10.3.7",
"react-router-dom": "^6.4.0",
"react-scripts": "5.0.1",
"react-spring": "^9.5.3",
"styled-components": "^5.3.5",
"web-vitals": "^2.1.4"
},
"main": "public/main.js",
"homepage": "./",
"scripts": {
"react-start": "react-scripts start",
"react-build": "react-scripts build",
"react-test": "react-scripts test --env=jsdom",
"react-eject": "react-scripts eject",
"electron-build": "electron-builder",
"release": "yarn react-build && electron-builder --publish=always",
"build": "yarn react-build && yarn electron-build",
"start": "concurrently \"cross-env BROWSER=none yarn react-start\" \"wait-on http://localhost:3000/ && electron .\""
},
"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": {
"concurrently": "^7.5.0",
"electron": "^21.2.3",
"electron-builder": "^23.6.0",
"wait-on": "^6.0.1"
}
}
It is clear that concurrently is being used to run all the commands together at same time. Now when I do yarn start, all commands are executed along with the react-start, but even after the react is available at http://localhost:3000 the wait-on never executes further and is stucked, eventually the electron never starts.
If tested without wait-on then all commands are executed well along with the electron.
Can someone guide on this?
I had the same issue.
All I needed to do was to change it from wait-on http://localhost:3000 to wait-on http://127.0.0.1:3000.
Hope that helps!
I have been trying to deploy my changes to GitHub repository, but there is an error.
Failed to compile.
Cannot read property 'includes' of undefined
The commands I run:
git init
git add .
git commit -m 'upgrade'
npm run deploy
I always used to deploy that way.
I have installed some node and webpack devDependencies, after that this error occurred.
Here is my package.json
{
"name": "react-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.14.1",
"#testing-library/react": "^12.1.2",
"#testing-library/user-event": "^13.4.2",
"emailjs-com": "^3.2.0",
"framer-motion": "^4.1.17",
"gsap": "^3.8.0",
"locomotive-scroll": "^4.1.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-gsap": "^3.2.1",
"react-icons": "^4.3.1",
"react-loading": "^2.0.3",
"react-locomotive-scroll": "^0.2.0",
"react-router-dom": "^5.3.0",
"react-scripts": "^4.0.3",
"react-scroll": "^1.8.4",
"sass-loader": "^12.2.0",
"styled-components": "^5.3.1",
"use-in-view": "^1.0.15",
"web-vitals": "^2.1.2",
"webpack": "^5.60.0"
},
"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",
"html-webpack-plugin": "^5.5.0",
"node-sass": "^6.0.1",
"sass": "^1.43.3",
"webpack-dev-server": "^4.3.1"
}
}
I am trying to deploy my react app using gh-pages, and after upload it I found white page. I tried many solutions but nothing work.
this is the url :
https://mosherad.github.io/spreago-react/
and here is the json file
{
"name": "spreago",
"version": "0.1.0",
"private": true,
"dependencies": {
"#apollo/react-hooks": "^3.1.3",
"#hapi/hawk": "^7.1.2",
"#material-ui/core": "^4.8.0",
"#material-ui/icons": "^4.5.1",
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.4.0",
"#testing-library/user-event": "^7.2.1",
"apollo-boost": "^0.4.7",
"bootstrap": "^4.4.1",
"gh-pages": "^2.2.0",
"graphql": "^14.5.8",
"history": "^4.10.1",
"lodash.flowright": "^3.5.0",
"react": "^16.12.0",
"react-apollo": "^3.1.3",
"react-bootstrap": "^1.0.0-beta.16",
"react-dom": "^16.12.0",
"react-icons": "^3.8.0",
"react-material-ui-form-validator": "^2.0.9",
"react-router-dom": "^5.1.2",
"react-scripts": "3.3.0",
"serve": "^11.3.0",
"yarn": "^1.21.1",
"yarn-install": "^1.0.0"
},
"homepage": "https://mosherad.github.io/spreago-react/",
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"eslint": "^6.7.2"
}
}