Can Anyone help me out that how can i deploy my react app on github. I have added all required dependecny in my package.json file with using of updated react modules.
Below is my package.json file :
{
"name": "git-sample-react",
"version": "0.1.0",
"private": true,
"homepage": "https://ababsheck.github.io/first-react-sample/",
"dependencies": {
"react": "^16.4.2",
"react-dom": "^16.4.2",
"react-scripts": "1.1.4"
},
"scripts": {
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"deploy": "gh-pages -b master -d build",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"gh-pages": "^1.2.0"
}
}
npm run deploy issue : github
Failed to get remote.origin.url (task must either be run in a git repository with a configured origin remote or must be configured with the "repo" option).
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! git-sample-react#0.1.0 deploy: `gh-pages -b master -d build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the git-sample-react#0.1.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\abhis\AppData\Roaming\npm-cache\_logs\2018-08-07T12_21_21_735Z-debug.log
I had the same issue, deploying react app in GitHub and resolved this issues with the following steeps:
Run the command in project folder git remote add origin <url>, with the URL of your repository on GitHub.
Run the command npm install --save-dev gh-pages.
Run the npm run build.
Run the command npm run deploy.
Change the branch in GitHub where you deploy see the image below. Under Source must be gh-pages branch.
I also have added the "homepage": "https://ababsheck.github.io/first-react-sample/",
before the script like:
"homepage": "https://ababsheck.github.io/first-react-sample/",
"scripts": {
"predeploy": "npm run build",
...// the rest of the code
Best approach
git init
git remote add origin <repo_link>
yarn add gh-pages
yarn build
yarn deploy
Now go to your Github and update the
Settings-->Github Pages-->source (change to gh-pages branch)-->root-->Save
and then check the link/homepage generated.
Related
I have downloaded a source code and am unable to use npm start to start the react app.
when I use npmstart I get the following errors.
npm ERR! Missing script: "start"
npm ERR!
npm ERR! Did you mean one of these?
npm ERR! npm star # Mark your favorite packages
npm ERR! npm stars # View packages marked as favorites
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/afrasiab./.npm/_logs/2023-01-13T04_36_09_195Z-debug-0.log
following is package.json
{
"name": "react-devtools",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "src/index.js",
"dependencies": {
"react": "16.8.6",
"react-dom": "16.8.6",
"react-scripts": "3.2.0"
},
"devDependencies": {
"typescript": "3.3.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
Unable to use npm start command on my react app.
Correct command for starting a react application is as :
npm run start
I think you don't install all dependencies. Agree with #Dipten
Use
npm install
I also had issue while using react first time. i have solved this issue with these lines.
npm rm -g create-react-app
npm install -g create-react-app
npx create-react-app my-app
you can add scripts in the package.json
,"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
}
This error also happens if you didn't open your project from the root of the project. Make sure to cd into the folder before opening it inside VS code.
Seems like you aren't running npm start in the root directory. So first cd to the root directory and run npm start.
Also, please consider attaching a screenshot of your folder structure because it will be easy for others to help you
I am trying to use this link as a reference to build a Notification system:
https://github.com/jacob-meacham/angular-notification-icons
First step is Running:
npm install angular-notification-icons --save
I am not sure what path I need to run this? I try to run it in my project path but I am getting this error:
npm ERR! code ENOSELF
npm ERR! Refusing to install package with name "angular-notification-icons" under a package
npm ERR! also called "angular-notification-icons". Did you name your project the same
npm ERR! as the dependency you're installing?
npm ERR!
Problem cause when name of project in package.json is similar with the name of npm module.
To solve please change project name in package.json to other.
example "angular-notification-icons-test"
{
"name": "angular-notification-icons-test",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
...
}
I recognize that there are several questions out there with a similar/same issue, but I have not been able to find a working solution from those posts yet. When running git push heroku master, the build runs for a while, then crashes with the following error:
> client#0.1.0 build /tmp/build_f22760141a320d80dbbda0a359da5e4b/client
> react-scripts build
/tmp/build_f22760141a320d80dbbda0a359da5e4b/client/node_modules/#hapi/hoek/lib/deep-equal.js:17
options = { prototype: true, ...options };
^^^
SyntaxError: Unexpected token ...
at Object.exports.runInThisContext (vm.js:76:16)
at Module._compile (module.js:513:28)
(it goes on for a bit more)
npm ERR! Linux 4.4.0-1048-aws
npm ERR! argv "/tmp/build_f22760141a320d80dbbda0a359da5e4b/.heroku/node/bin/node" "/tmp/build_f22760141a320d80dbbda0a359da5e4b/.heroku/node/bin/npm" "run" "build"
npm ERR! node v6.3.1
npm ERR! npm v3.10.3
npm ERR! code ELIFECYCLE
npm ERR! client#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the client#0.1.0 build script 'react-scripts build'.
There is more to it above and below, but I believe that is the relevant portion. My suspicion from reading this and other errors is that my package.json file is not set up correctly. Here is what I hope are the helpful portions to see:
// root package.json:
...
"engines": {
"node": ">= 6.9.4",
"npm": ">= 4.4.0"
},
"scripts": {
"start": "react-scripts start",
"test": "echo \"Error: no test specified\" && exit 1",
"build": "cd client && npm install && npm run build && cd ..",
"deploy": "cp -a client/build/. public/",
"postinstall": "npm run build && npm run deploy && echo 'Client built!'"
},
...
// and /client/package.json:
...javascript
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
...
I was following this article while structuring my app, and it all went well until the deploy to Heroku.
Here are some other potentially useful things to note:
// Profile
web: bundle exec rails s
// Heroku buildpacks:
1. heroku/nodejs
2. heroku/ruby
// Node and npm are both updated
This is my first question on here, so I am sorry if there is insufficient or unnecessary information. Any help on where to look to fix this would be greatly appreciated. Thank you!
Well, it is working now, and all I did was:
git add .
git commit -m "Working on setting up Heroku. It's not working"
git push origin master
Then when I ran git push heroku master, it built! My guess is that Heroku was watching for changes to my master branch, and all the work I did reading other people's posts was never pushed to master. Very much a guess on that though.
I'm trying to do
npm start
In my react project but always have a problem
npm ERR! path /Users/dan/package.json
npm ERR! code ENOENT
npm ERR! errno -2
npm ERR! syscall open
npm ERR! enoent ENOENT: no such file or directory, open '/Users/dan/package.json'
npm ERR! enoent This is most likely not a problem with npm itself
npm ERR! enoent and is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/dan/.npm/_logs/2018-04-11T17_50_33_041Z-debug.log
I've also know that 5 version of npm isn't the best. Because I've reinstall npm and now I've:
node -v
v8.11.1
npm -v
4.6.1
package.json
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Try downgrade react-script
npm install react-scripts#2.1.8 --save
It's work for me!
Execute the following commands:
npx create-react-app myfirstreact
cd myfirstreact
npm start
It should work unless there are no files to work within the project.
Check if your react boilerplate template was fully generated by create-react-app otherwise you will need to upgrade your create-react-app
One way to know the template is not generated is if the src folder in your project directory does not exist.
your mistake is you are not in main file please run this command
cd-your file name
Problem
I am trying to put my React app on github pages. However, I can't even deploy the app to GitHub pages.
My Setup
I am using Visual Studio Code on my Windows 10 machine. I created my React app with create-react-app. I followed this tutorial to set up my app for Github Pages. This is my package.json:
{
"homepage": "https://MisturDust319.github.io/ign_code_foo",
"name": "ign_code_foo",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.18.0",
"bootstrap": "^4.1.0",
"gh-pages": "^1.1.0",
"react": "^16.3.1",
"react-dom": "^16.3.1",
"react-scripts": "1.1.4",
"reactstrap": "^5.0.0-beta.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"predeploy": "npm run build",
"deploy:": "gh-pages -d build"
},
"devDependencies": {}
}
The full source is available here
What I've Done
To deploy, you are supposed to just run
npm run deploy
However, when I enter that command, from Windows PowerShell, Git Bash, and the Command Prompt, I just get several variations of "command not found".
In response, I uninstalled gh-pages from dev-dependencies and reinstalled it as a normal dependency. No change. At this point, I've exhausted all solutions I can think of, and Google has only pulled up people who didn't include the deploy command in package.json.
You need to install gh-pages globally by adding "-g":
npm install -g gh-pages --save-dev
and then
npm run deploy
Docs: https://docs.npmjs.com/downloading-and-installing-packages-globally
You need install gh-pages before running deploy, run:
npm install --save-dev gh-pages
then
npm run deploy
I cannot add a comment to this post, because I don't have enough score. But there is an error in the your package.json code:
"deploy:": "gh-pages -d build"
Because, there is an extra semicolon :. It should be:
"deploy": "gh-pages -d build"
Little explanation about why this issue is happening ,followed by the fix of this issue
In package.json file
"devDependencies": {
"gh": "^2.8.6",
"pages": "0.0.16"
}
gets created when we run npm install gh pages —save-dev
but to deploy our project when we run npm run deploy that time it checks in package.json file against deploy which script is mentioned
Since in package.json
"scripts": {
"deploy": "gh-pages -d build",
....}
gh-pages -d build script is mentioned.
It will try to perform this operation but the reason its throwing error like this( if you are mac user) on npm run deploy
sh: gh-pages: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! basic#0.1.0 deploy: `gh-pages -d build`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the basic#0.1.0 deploy script.
is because gh-pages also need to be installed globally as well.
So if you run npm install -g gh-pages --save-dev
Issue which you're getting related to gh-pages installation will get resolved.
Might be a path problem, it's a usual case for Windows users that try to use cmd instead of *nix terminal. Try to exit and enter cmd if you didn't yet. After that you should ensure that it can access gh-pages package.
Also you might look on answers to a similar question. And ensure that your git version is >= 1.9 as it's told in requirements.
I had copied items into the wrong section. In my case my dependencies are above the scripts and I had put two scripts in the dependencies section like a money. Moving them into the right place resolved the issue for me.
Tip: make sure your script are not placed in the wrong section.
Very, very likely you don't have git added to your Path variable
If running git in your CMD results in an error - this is the issue.
Add git.exe and other binaries to your path, usually it C:\Program Files\Git\bin and try again running gh-pages -d build