We Keep Coding

Updating NPM Packages Fails

My package.json file:
{
"name": "...",
"version": "0.1.0",
"private": true,
"dependencies": {
"#material-ui/core": "^4.12.4",
"apollo-client": "^1.9.2",
"bootstrap": "4.0.0-alpha.6",
"glamor": "^2.20.40",
"glamorous": "^4.9.1",
"history": "^4.7.2",
"jwt-decode": "^2.2.0",
"lodash": "^4.17.4",
"moment": "2.18.1",
"normalize.css": "^7.0.0",
"polished": "^1.7.0",
"prop-types": "^15.6.0",
"qs": "^6.5.1",
"react": "^17.0.0",
"react-addons-css-transition-group": "^15.6.2",
"react-addons-transition-group": "^15.6.2",
"react-apollo": "^1.4.15",
"react-bootstrap": "^0.31.3",
"react-burger-menu": "^3.0.8",
"react-day-picker": "^6.2.1",
"react-dom": "^17.0.0",
"react-loader": "^2.4.2",
"react-rangeslider": "^2.2.0",
"react-rating-stars-component": "^2.2.0",
"react-redux": "^5.0.6",
"react-router": "^4.2.0",
"react-router-bootstrap": "^0.24.4",
"react-router-dom": "^4.2.2",
"react-scripts": "1.0.14",
"react-select": "^1.0.0-rc.10",
"react-stripe-elements": "^1.0.1",
"react-transition-group": "^2.2.1",
"reactstrap": "^4.8.0",
"redux": "^3.7.2",
"redux-form": "^7.1.0",
"redux-logger": "^3.0.6",
"redux-pack": "^0.1.5",
"redux-thunk": "^2.2.0",
"revalidate": "^1.2.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"lint": "eslint src",
"eject": "react-scripts eject"
},
"devDependencies": {
"eslint": "^4.7.2",
"eslint-config-4catalyzer-react": "^0.3.3",
"eslint-plugin-import": "^2.7.0",
"eslint-plugin-jsx-a11y": "^6.6.1",
"eslint-plugin-react": "^7.4.0"
}
}
I'm in the process of updating my codebase.
I want to be able to update a single package, then test out my application then move on to updating another package.
What command should I use for the update process? npm update or npm install?
I tried npm update redux and received the following error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: react-apollo#1.4.16
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.0" from the root project
npm ERR! peer react#"^16.8.0 || ^17.0.0" from #material-ui/core#4.12.4
npm ERR! node_modules/#material-ui/core
npm ERR! #material-ui/core#"^4.12.4" from the root project
npm ERR! 14 more (react-transition-group, #material-ui/styles, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"0.14.x || 15.* || ^15.0.0 || ^16.0.0" from react-apollo#1.4.16
npm ERR! node_modules/react-apollo
npm ERR! react-apollo#"^1.4.15" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: react#16.14.0
npm ERR! node_modules/react
npm ERR! peer react#"0.14.x || 15.* || ^15.0.0 || ^16.0.0" from react-apollo#1.4.16
npm ERR! node_modules/react-apollo
npm ERR! react-apollo#"^1.4.15" 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.
What does the error exactly mean? And how would I fix it? Without having to --force or --legacy-peer-deps?

In this error, there is a compatibility issue with 2 dependencies.
react-apollo#1.4.16 does not support react 17 version
Material UI v4 does not officially support React v17
material4 is not compatible with react17

heoku is not finding ws (websocket)

I have an App that locally works.
$env:ENV="local"
npm run dev
Its Package.json
{
"name": "forge-dataviz-iot-reference-app",
"version": "0.3.3",
"description": "Autodesk Forge Viewer Data Visualization Sample Application",
"main": "server/localserver.js",
"engines": {
"node": "14.19.2"
},
"scripts": {
"postinstall": "cd server && npm install",
"dev": "concurrently --kill-others \"npm run watch\" \"npm run start\" \"nodemon server/localserver.js --delay 300ms --ext js,jsx\"",
"start": "ws -p 9081",
"watch": "webpack --watch --config webpack.config.js",
"dev-client": "npm install && concurrently --kill-others \"npm run watch\" \"npm run start\"",
"build": "webpack --config webpack.config.js"
},
"repository": {
"type": "git",
"url": "https://github.com/Autodesk-Forge/forge-dataviz-iot-reference-app.git"
},
"author": "Autodesk Inc.",
"license": "MIT",
"devDependencies": {
"#babel/core": "^7.0.0-beta.41",
"#babel/plugin-transform-spread": "^7.13.0",
"#babel/preset-env": "7.12.11",
"#babel/preset-react": "7.12.13",
"babel-loader": "^8.1.0",
"concurrently": "^3.5.1",
"css-loader": "3.6.0",
"local-web-server": "4.2.1",
"mini-css-extract-plugin": "^1.4.0",
"node-loader": "^1.0.2",
"node-sass": "^5.0.0",
"nodemon": "2.0.7",
"react": "16.13.1",
"react-dom": "16.13.1",
"sass-loader": "^10.1.1",
"svg-url-loader": "^7.1.1",
"webpack": "^5.11.0",
"webpack-cli": "^4.5.0",
"webpack-node-externals": "^1.7.2"
},
"dependencies": {
"#hig/theme-data": "^2.17.0",
"#material-ui/core": "^4.11.0",
"#material-ui/icons": "^4.9.1",
"#material-ui/lab": "^4.0.0-alpha.56",
"chronos-etu": "3.1.0",
"codemirror": "^5.61.1",
"echarts": "^4.9.0",
"echarts-for-react": "^2.0.16",
"forge-dataviz-iot-data-modules": "0.1.11",
"forge-dataviz-iot-react-components": "0.1.17",
"lodash": "^4.17.15",
"moment": "^2.27.0",
"pixi.js": "^5.3.7",
"q": "^1.5.1",
"react-codemirror2": "^7.2.1",
"react-copy-to-clipboard": "^5.0.3",
"react-dates": "^21.8.0",
"react-rnd": "^10.2.1",
"react-router-dom": "5.2.0",
"socket.io": "^3.0.4",
"socket.io-client": "^3.0.4",
"ws": "^6.2.2",
"uuid": "^8.3.2"
}
}
Procfile // IS IT OK???
$env:ENV="local"
web: npm run dev
Error
heroku logs --tail
2022-06-01T05:23:27.918673+00:00 app[web.1]: > forge-dataviz-iot-reference-app#0.3.3 start /app
2022-06-01T05:23:27.918673+00:00 app[web.1]: > ws -p 9081
2022-06-01T05:23:27.918674+00:00 app[web.1]:
2022-06-01T05:23:27.929836+00:00 app[web.1]: sh: 1: ws: not found
2022-06-01T05:23:27.935528+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2022-06-01T05:23:27.935911+00:00 app[web.1]: npm ERR! syscall spawn
2022-06-01T05:23:27.936120+00:00 app[web.1]: npm ERR! file sh
2022-06-01T05:23:27.936316+00:00 app[web.1]: npm ERR! errno ENOENT
2022-06-01T05:23:27.945101+00:00 app[web.1]: npm ERR! forge-dataviz-iot-reference-app#0.3.3 start: `ws -p 9081`
2022-06-01T05:23:27.945232+00:00 app[web.1]: npm ERR! spawn ENOENT
2022-06-01T05:23:27.945381+00:00 app[web.1]: npm ERR!
2022-06-01T05:23:27.945506+00:00 app[web.1]: npm ERR! Failed at the forge-dataviz-iot-reference-app#0.3.3 start script.
2022-06-01T05:23:27.945622+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Someone please download app (if required) from link to findout this problem.
I tried:
1: npm install --save ws
2: npm install --save ws#6.2.2
3:put it in package.json // originally it was not there.
4:delete node modules and installed again
5: delete app and made new one
But the error is still there. How can I make it work on Heroku?

can't install dependencies because of node and webpack version conflict

I am trying to install the dependencies with the exact version which are listed in json file, and I got errors below:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! webpack#"^4.35.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack#"^5.1.0" from terser-webpack-plugin#5.3.1
npm ERR! node_modules/terser-webpack-plugin
npm ERR! dev terser-webpack-plugin#"^5.1.1" 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.
since the dependencies with the required version are not the latest one, I downgrade my node.js from latest version 16 to 14+, and install with npm i --leacy-peer-deps, but the error shows still the same, seems the version from node or webpack still not compatible to the dependencies(Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! webpack#"^4.35.3" from the root project).
how can I solve this problem?
here is the json list:
{
"name": "example-project",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node src/server/index.js",
"build-prod": "webpack --config webpack.prod.js",
"build-dev": "webpack-dev-server --config webpack.dev.js --open"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"dependencies": {
"dotenv": "^8.2.0",
"express": "^4.17.1",
"jest-fetch-mock": "^3.0.3",
"webpack": "^4.35.3",
"webpack-cli": "^3.3.5"
},
"devDependencies": {
"#babel/core": "^7.13.15",
"#babel/plugin-transform-modules-commonjs": "^7.13.8",
"#babel/preset-env": "^7.13.15",
"babel-loader": "^8.2.2",
"body-parser": "^1.19.0",
"clean-webpack-plugin": "^3.0.0",
"cors": "^2.8.5",
"css-loader": "^5.2.1",
"html-webpack-plugin": "^3.2.0",
"jest": "^26.6.3",
"mini-css-extract-plugin": "^1.4.1",
"node-fetch": "^2.6.1",
"node-sass": "^5.0.0",
"optimize-css-assets-webpack-plugin": "^5.0.4",
"sass": "^1.32.8",
"sass-loader": "^10.1.1",
"style-loader": "^2.0.0",
"terser-webpack-plugin": "^5.1.1",
"webpack-dev-server": "^3.11.2",
"workbox-webpack-plugin": "^6.1.5"
}
}

Try to delete package-lock.json and clear npm cache using 'npm cache clean -f' before npm i.
Caret (^) notation: It will update you to all future minor/patch versions, without incrementing the major version. ^2.3.4 will use releases from 2.3.4 to <3.0.0
Tilde ( ~ ): It will update you to all future patch versions, without incrementing the minor version. ~1.2.3 will use releases from 1.2.3 to <1.3.

Chunk.entrypoints: Use Chunks.addGroup instead

I'm using npm version 6.0.1.
my os is macOs High Sierra Version 10.13.3
I want to build my project but I got this error message:
Creating an optimized production build...
/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/webpack/lib/Chunk.js:533
throw new Error("Chunk.entrypoints: Use Chunks.addGroup instead");
^
Error: Chunk.entrypoints: Use Chunks.addGroup instead
at Chunk.set (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/webpack/lib/Chunk.js:533:9)
at /Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/extract-text-webpack-plugin/dist/index.js:176:40
at Array.forEach (<anonymous>)
at Compilation.<anonymous> (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/extract-text-webpack-plugin/dist/index.js:171:18)
at Compilation.applyPluginsAsyncSeries (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/tapable/lib/Tapable.js:206:13)
at Compilation.seal (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/webpack/lib/Compilation.js:605:8)
at applyPluginsParallel.err (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/webpack/lib/Compiler.js:508:17)
at /Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/webpack/lib/Compilation.js:507:11)
at processModuleDependencies.err (/Users/mohammadmehdi/Documents/Work/sevenapp/node_modules/react-scripts/node_modules/webpack/lib/Compilation.js:477:14)
at process._tickCallback (internal/process/next_tick.js:172:11)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! sevenapp#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the sevenapp#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/mohammadmehdi/.npm/_logs/2018-07-02T13_17_58_331Z-debug.log
this is my package.json:
{
"name": "sevenapp",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.18.0",
"bootstrap": "^4.0.0",
"jquery": "^3.3.1",
"rc-pagination": "^1.16.4",
"react": "^16.2.0",
"react-countup": "^3.0.3",
"react-dom": "^16.2.0",
"react-paginate": "^5.2.3",
"react-player": "^1.6.4",
"react-popup": "^0.9.3",
"react-redux": "^5.0.7",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"react-scripts": "1.1.1",
"redux": "^4.0.0"
},
"scripts": {
"start": "PORT=3000 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"description": "",
"main": "index.js",
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"css-loader": "^0.28.11",
"jshint": "^2.9.5",
"jshint-loader": "^0.8.4",
"style-loader": "^0.21.0",
"webpack": "^4.6.0",
"webpack-cli": "^2.0.15"
},
"author": "",
"license": "ISC"
}
I run this command:
npm run build --release
Do I need to install webpack?
Can I build my project without webpack?
I want to release my project?
I don't know what is my wrong.

Looks related to webpack-contrib/extract-text-webpack-plugin#701.
Running npm install -D extract-text-webpack-plugin#next solved the issue locally for me.
you can also check same thread here on below link https://github.com/facebook/create-react-app/issues/4356

Heroku NodeJS App Build Failing

I'm receiving a build failed error while deploying my NodeJS app to Heroku. Here is the build log:
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NODE_VERBOSE=false
NODE_ENV=production
NODE_MODULES_CACHE=true
-----> Installing binaries
engines.node (package.json): 8.10.0
engines.npm (package.json): 5.7.1
Resolving node version 8.10.0...
Downloading and installing node 8.10.0...
Bootstrapping npm 5.7.1 (replacing 5.6.0)...
npm 5.7.1 installed
-----> Restoring cache
Loading 2 from cacheDirectories (default):
- node_modules
- bower_components (not cached - skipping)
-----> Building dependencies
Installing node modules (package.json + package-lock)
npm ERR! path /tmp/build_39ba38c4a10780e26942fa5ee7294cd5/node_modules/fsevents/node_modules/abbrev
npm ERR! code ENOENT
npm ERR! errno -2
npm ERR! syscall rename
npm ERR! enoent ENOENT: no such file or directory, rename '/tmp/build_39ba38c4a10780e26942fa5ee7294cd5/node_modules/fsevents/node_modules/abbrev'
-> '/tmp/build_39ba38c4a10780e26942fa5ee7294cd5/node_modules/fsevents/node_modules/.abbrev.DELETE'
npm ERR! enoent This 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! /tmp/npmcache.X6IAU/_logs/2018-03-24T03_18_22_202Z-debug.log
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
If you're stuck, please submit a ticket so we can help:
https://help.heroku.com/
Love,
Heroku
! Push rejected, failed to compile Node.js app. ! Push failed
I have deleted my node_modules folder and ran npm install and deleted/installed the abbrev npm package. Still the same error after this.
Here is my package.json:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "nodemon bin/dev",
"clean": "rm -rf dist",
"build": "npm run clean && mkdir dist && babel server -s -d dist",
"production": "npm run build && nodemon bin/production"
},
"keywords": [],
"author": "",
"devDependencies": {
"dotenv": "^4.0.0"
},
"dependencies": {
"async": "^2.6.0",
"babel-cli": "^6.26.0",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.6.1",
"bcrypt-nodejs": "0.0.3",
"body-parser": "^1.18.2",
"boom": "^7.2.0",
"compression": "^1.7.2",
"cron": "^1.3.0",
"express": "^4.16.3",
"express-rate-limit": "^2.11.0",
"express-validator": "^3.2.1",
"flat": "^4.0.0",
"generate-password": "^1.4.0",
"helmet": "^3.12.0",
"jsonwebtoken": "^7.4.3",
"moment": "^2.21.0",
"moment-timezone": "^0.5.14",
"mongoose": "^4.13.12",
"morgan": "^1.9.0",
"nodemon": "^1.17.2",
"passport": "^0.3.2",
"passport-jwt": "^2.2.1",
"passport-local": "^1.0.0",
"sendgrid": "^5.2.3",
"twilio": "^3.13.1",
"uuid": "^3.2.1"
},
"engines": {
"node": "8.10.0",
"npm": "5.7.1"
}
}
Any suggestions are appreciated. Thank you.