How to solve npm error "npm ERR! code ELIFECYCLE"? - reactjs

No error when I entered npm run dev to edit the code, but can not build/export it.
Here is the ERROR that shown on the Terminal when I entered npm run build
> #landing/015-next#0.0.1 postbuild C:\Users\Han\Desktop\andamilo\agency-alpha-next
> next-sitemap
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! #landing/015-next#0.0.1 postbuild: `next-sitemap`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the #landing/015-next#0.0.1 postbuild 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\Han\AppData\Roaming\npm-cache\_logs\2021-09-30T03_47_34_736Z-debug.log
package.json
{
"name": "#landing/015-next",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"serve": "next start",
"export": "next export",
"postbuild": "next-sitemap"
},
"dependencies": {
"framer-motion": "^2.9.5",
"next": "^10.0.3",
"next-compose-plugins": "^2.2.1",
"next-optimized-images": "^2.6.2",
"polished": "^4.0.5",
"rc-drawer": "^4.1.0",
"rc-tabs": "^11.7.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-ga": "^3.3.0",
"react-icons": "^4.1.0",
"react-responsive": "^8.2.0",
"react-scroll": "^1.8.1",
"react-stickynode": "^3.0.4",
"swiper": "^6.3.5",
"theme-ui": "^0.3.4"
},
"devDependencies": {
"imagemin-mozjpeg": "^9.0.0",
"imagemin-optipng": "^8.0.0",
"imagemin-svgo": "^8.0.0",
"next-sitemap": "^1.1.6"
}
}
I have deleted cache and re-install npm, but it is not working.
Is there alternative way to resolve this error?
best regards,

Related

How to fix Could not resolve dependency: npm ERR

Hi on npm install i got this error:
how can i solve it without using --force or --legacy-peer-deps?
i tried to looking for similar problems but all the suggestion is to using the above flags.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #babel/eslint-parser#7.18.2
npm ERR! Found: eslint#5.16.0
npm ERR! node_modules/eslint
npm ERR! dev eslint#"^5.16.0" from the root project
npm ERR! peer eslint#"*" from #typescript-eslint/experimental-utils#2.34.0
npm ERR! node_modules/#typescript-eslint/experimental-utils
npm ERR! #typescript-eslint/experimental-utils#"^2.5.0" from eslint-plugin-jest#23.20.0
npm ERR! node_modules/eslint-plugin-jest
npm ERR! dev eslint-plugin-jest#"^23.7.0" from the root
project
npm ERR! 8 more (babel-eslint, eslint-config-prettier, eslint-loader, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer eslint#"^7.5.0 || ^8.0.0" from #babel/eslint-parser#7.18.2
npm ERR! node_modules/#babel/eslint-parser
npm ERR! #babel/eslint-parser#"^7.16.5" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: eslint#8.19.0
npm ERR! node_modules/eslint
npm ERR! peer eslint#"^7.5.0 || ^8.0.0" from #babel/eslint-parser#7.18.2
npm ERR! node_modules/#babel/eslint-parser
npm ERR! #babel/eslint-parser#"^7.16.5" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
this is my package.json file:
{
"name": "ng_starter",
"version": "0.0.1",
"description": "ng_starter",
"private": true,
"scripts": {
"dev": "webpack-cli serve --mode development --env=development --hot",
"mock": "webpack-cli serve --mode development --env=mock --hot",
"prod": "webpack-cli build --mode production --env=production",
"devprod": "webpack-cli build --mode development --env=devprod",
"test": "jest --env=jsdom",
"test-dev": "jest --env=jsdom --watch",
"lint-fix": "eslint --fix --ext .js --ext .jsx src"
},
"dependencies": {
"#babel/eslint-parser": "^7.16.5",
"#reduxjs/toolkit": "^1.7.1",
"axios": "^0.21.1",
"catalogone-ui-components": "1.16.0",
"catalogone-ui-utility": "1.16.0",
"classnames": "2.2.6",
"d3-hierarchy": "^3.1.1",
"i18next": "17.0.3",
"connected-react-router": "^6.9.1",
"lodash": "^4.17.21",
"prop-types": "15.7.2",
"query-string": "^6.10.1",
"react": "16.8.6",
"react-dom": "16.8.6",
"react-redux": "^7.2.6",
"react-redux-i18n": "^1.9.2",
"react-test-renderer": "16.8.6",
"redux-actions": "^2.6.5",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0",
"validator": "^12.2.0"
},
"devDependencies": {
"#babel/cli": "7.12.10",
"#babel/core": "7.12.10",
"#babel/plugin-proposal-class-properties": "7.12.1",
"#babel/plugin-proposal-decorators": "7.12.12",
"#babel/plugin-proposal-export-default-from": "7.12.1",
"#babel/plugin-proposal-function-bind": "7.12.1",
"#babel/plugin-proposal-nullish-coalescing-operator": "7.12.1",
"#babel/plugin-proposal-optional-chaining": "7.12.7",
"#babel/plugin-transform-runtime": "^7.12.10",
"#babel/preset-env": "7.12.11",
"#babel/preset-react": "^7.16.7",
"#babel/register": "7.12.10",
"#babel/runtime": "^7.12.5",
"babel-eslint": "^10.1.0",
"babel-loader": "8.0.6",
"babel-plugin-istanbul": "5.2.0",
"babel-plugin-module-resolver": "3.2.0",
"clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^6.4.1",
"css-loader": "2.1.1",
"eslint": "^5.16.0",
"eslint-config-prettier": "^4.1.0",
"eslint-loader": "^3.0.3",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jest": "^23.7.0",
"eslint-plugin-prettier": "^3.1.2",
"eslint-plugin-react": "^7.18.3",
"eslint-plugin-react-hooks": "4.2.0",
"eslint-webpack-plugin": "^3.1.0",
"file-loader": "^4.0.0",
"html-webpack-plugin": "^4.5.2",
"jest": "^25.1.0",
"mini-css-extract-plugin": "^1.6.2",
"mocker-api": "^2.9.4",
"node-sass": "npm:sass#1.32.8",
"prettier": "1.19.1",
"react-router-dom": "^5.3.0",
"sass-loader": "7.1.0",
"sass-resources-loader": "2.0.1",
"source-map-loader": "^1.1.3",
"style-loader": "0.23.1",
"svg-transform-loader": "^2.0.13",
"url-loader": "2.0.0",
"webpack": "^4.44.0",
"webpack-cli": "^4.9.1",
"webpack-dev-server": "^3.10.3",
"webpack-merge": "^5.7.3"
}
}
It seems to me like I have babel/eslint-parser#7.18.2
but I'm not totally sure how to solve this

ERESOLVE unable to resolve dependency tree in my react native web project

I got a react native web template that I am trying to make work. So I installed #reduxjs/toolkit for my state management. But I ran into an error when running the project after installation.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react#16.9.0
npm ERR! node_modules/react
npm ERR! peer react#"16.9.0" from react-native#0.61.5
npm ERR! node_modules/react-native
npm ERR! peer react-native#"^0.61.0" from #react-native-community/cli#3.2.1
npm ERR! node_modules/#react-native-community/cli
npm ERR! #react-native-community/cli#"^3.0.0" from react-native#0.61.5
npm ERR! react-native#"^0.61.5" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! #reduxjs/toolkit#"^1.6.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#17.0.2
npm ERR! node_modules/react
npm ERR! peerOptional react#"^16.14.0 || ^17.0.0" from #reduxjs/toolkit#1.6.0
npm ERR! node_modules/#reduxjs/toolkit
npm ERR! #reduxjs/toolkit#"^1.6.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
These are the dependecies and devDependencies for the package.json files for each directory.
root/packages/common
{
"name": "#monorepo/common",
"version": "1.0.0",
"main": "dist/index.js",
"scripts": {
"build": "rm -rf dist && tsc",
"watch": "tsc --watch"
},
"license": "MIT",
"dependencies": {
"#reduxjs/toolkit": "^1.6.0",
"grunt-sync": "^0.8.2",
"react-native": "^0.61.5"
},
"devDependencies": {
"#types/react-native": "^0.61.16",
"grunt": "^1.4.1",
"grunt-contrib-watch": "^1.1.0",
"typescript": "^3.8.2"
}
}
root/packages/mobile
"dependencies": {
"react": "16.8.6",
"react-native": "0.60.5"
},
"devDependencies": {
"#monorepo/common": "1.0.0",
"#babel/core": "^7.5.0",
"#babel/runtime": "^7.5.0",
"#react-native-community/eslint-config": "^0.0.3",
"#types/jest": "^24.0.18",
"#types/react": "^16.9.2",
"#types/react-native": "^0.60.14",
"#types/react-test-renderer": "^16.9.0",
"babel-jest": "^24.1.0",
"jest": "^24.1.0",
"metro-react-native-babel-preset": "0.54.1",
"react-test-renderer": "16.8.6",
"typescript": "^3.6.3"
}
root/packages/web
"dependencies": {
"#monorepo/common": "1.0.0",
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"#types/jest": "^24.0.0",
"#types/node": "^12.0.0",
"#types/react": "^16.9.0",
"#types/react-dom": "^16.9.0",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-native-web": "^0.12.1",
"react-scripts": "3.4.0",
"typescript": "~3.7.2"
},
"devDependencies": {
"#types/react-native": "^0.61.16",
"cross-env": "^7.0.3",
"uuid": "^8.3.2"
}
I tried upgrading to the latest packages, but I still run into the same error, this time the conflict is somewhere else, and the top dependency is still #react-native-community/cli.
This should allow a more flexible peer dependency resolution
npm install --legacy-peer-deps
Faced the same problem. Unable to install '#reduxjs/toolkit' due to a mismatch of the react version(>17.0.0). You need to update the react to the latest (preferably) version. To do this, delete the folders 'react', 'react-dom', 'react-native' from the node_modules folder.
Next, write the command in the terminal in the project directory:
npm install react#latest react-dom#latest react-native#latest
Next, if everything went well, you can check which versions you have now, if everything is correct, then we calmly install the Redux toolkit with the command:
npm install #reduxjs/toolkit
Personally, it helped me

Unable to install Flow for React in Laravel project

I am developing a Laravel application. For the front end, I am using React JS. Now I am trying to integrate Flow into my project. I followed this link https://flow.org/en/docs/install/. But not working.
I run this command in the root folder
npm install --save-dev babel-cli babel-preset-flow
Then created .babelrc file in the project root folder with the following content
{
"presets": ["flow"]
}
Then I run this command
npm install --save-dev flow-bin
This is my package.json
{
"private": true,
"scripts": {
"flow": "flow",
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"#babel/preset-react": "^7.0.0",
"axios": "^0.18.0",
"babel-cli": "^6.26.0",
"babel-preset-flow": "^6.23.0",
"babel-preset-react": "^6.23.0",
"bootstrap": "^4.2.1",
"cross-env": "^5.1",
"flow-bin": "^0.89.0",
"jquery": "^3.2",
"laravel-mix": "^4.0.7",
"lodash": "^4.17.5",
"popper.js": "^1.12",
"react": "^16.2.0",
"react-dom": "^16.7.0",
"react-scripts": "^2.1.2",
"resolve-url-loader": "^2.3.1",
"sass": "^1.15.2",
"sass-loader": "^7.1.0"
},
"dependencies": {
"#coreui/coreui": "github:coreui/coreui",
"#coreui/coreui-plugin-chartjs-custom-tooltips": "github:coreui/coreui-plugin-chartjs-custom-tooltips",
"#coreui/react": "^2.1.2",
"classnames": "^2.2.6",
"core-js": "^2.6.1",
"enzyme": "^3.8.0",
"flag-icon-css": "^3.2.1",
"font-awesome": "^4.7.0",
"node-sass": "^4.11.0",
"prop-types": "^15.6.2",
"react-app-polyfill": "^0.1.3",
"react-loadable": "^5.5.0",
"react-redux": "^6.0.0",
"react-router": "^4.3.1",
"react-router-config": "^4.4.0-beta.6",
"react-router-dom": "^4.3.1",
"react-test-renderer": "^16.7.0",
"reactstrap": "^6.5.0",
"redux": "^4.0.1",
"redux-thunk": "^2.3.0",
"simple-line-icons": "^2.4.1"
}
}
Then I run this
npm run flow init
Then this
npm run flow
I got this error when I run the above command.
> # flow /Users/wai/Desktop/easy-eat
> flow
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ vendor/symfony/translation/Tests/fixtures/empty.json:1:1
Unexpected end of input
1│
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ vendor/symfony/translation/Tests/fixtures/malformed.json:2:11
Unexpected string
1│ {
2│ "foo" "bar"
3│ }
Found 2 errors
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! # flow: `flow`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the # flow 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! /Users/wai/.npm/_logs/2018-12-28T21_01_36_563Z-debug.log
What is missing and how can I fix it?
I ran into this as well. By default Flow will check all the directories in your project. You can fix this error by creating a .flowconfig file in the root of your project. (Running yarn run flow init will also create this file for you)
Make sure to ignore the vendor folder through this config. My config looks like this:
[ignore]
.*/vendor/.*
[include]
[libs]
[lints]
[options]
[strict]

npm error when adding the latest work to the gh-pages deploy

I had to create a docs in order to see my react page displaying on github pages. I used h-pages deploy and keep getting this error when I am attempting to update the gh-pages.
The only branch I can access is *master.
I was doing :
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
this is the error :
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! rReduxTable#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the rReduxTable#0.1.0 build 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! /Users/marianaperez/.npm/_logs/2018-03-12T19_02_15_196Z-debug.log
this is my json package
{
"name": "rReduxTable",
"version": "0.1.0",
"private": true,
"devDependencies": {
"gh-pages": "^1.1.0",
"husky": "^0.14.3",
"lint-staged": "^7.0.0",
"prettier": "^1.11.0",
"react-scripts": "^1.0.17"
},
"dependencies": {
"debug": "^3.1.0",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-redux": "^5.0.6",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"react-router-redux": "next",
"react-sortable-table": "^1.3.0",
"redux": "^3.7.2",
"redux-thunk": "^2.2.0",
"sanitize.css": "^5.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"precommit": "lint-staged",
"predeploy": "npm run build",
"deploy": "gh-pages -b master -d build"
},
"homepage": "https://marianapt.github.io/reduxTable/",
"lint-staged": {
"*.{js,json,css,md}": [
"prettier --write",
"git add"
]
}
}

How to install ng on elastic beanstalk

I am new to elastic beanstalk, I am trying to deploy my angular-cli app on node.js elastic beanstalk. I am getting following error.
/var/log/nodejs/nodejs.log
-------------------------------------
npm ERR! Failed at the mypleaks-angular#0.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
> mypleaks-angular#0.0.0 start /var/app/current
> ng serve
sh: ng: command not found
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! mypleaks-angular#0.0.0 start: `ng serve`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the mypleaks-angular#0.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
> mypleaks-angular#0.0.0 start /var/app/current
> ng serve
To resolve this I have used .ebextensions/nodecommand.config as below
option_settings:
aws:elasticbeanstalk:container:nodejs:
NodeCommand: "npm install"
But issue still not got resolved. my Directory structure is as below:-
mypleaks-angular/
.ebextensions/nodecommand.config
package.json
and package.json is as below:-
{
"name": "mypleaks-angular",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^5.0.0",
"#angular/common": "^5.0.0",
"#angular/compiler": "^5.0.0",
"#angular/core": "^5.0.1",
"#angular/forms": "^5.0.0",
"#angular/http": "^5.0.0",
"#angular/platform-browser": "^5.0.0",
"#angular/platform-browser-dynamic": "^5.0.0",
"#angular/router": "^5.0.0",
"auth0-js": "^8.11.2",
"core-js": "^2.4.1",
"ng-cli": "^0.7.0",
"rxjs": "^5.5.2",
"zone.js": "^0.8.14"
},
"devDependencies": {
"#angular/cli": "1.5.0",
"#angular/compiler-cli": "^5.0.0",
"#angular/language-service": "^5.0.0",
"#types/jasmine": "~2.5.53",
"#types/jasminewd2": "~2.0.2",
"#types/node": "~6.0.60",
"codelyzer": "~3.2.0",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.4.2"
}
}
Please help me resolve this issue.
Remove this ebextensions:
option_settings:
aws:elasticbeanstalk:container:nodejs:
NodeCommand: "npm install"
Add:
"#angular/cli": "latest",
under dependencies in package.json
Then zip the folder content, and upload the zip file to Elastic Beanstalk

Resources