[Bug]: NPM deprecation warnings when installing fresh

[gbowne1]

Describe the Bug

Today Oct 18th 2023, I did a clean installing the 3 sets of packages, client, e2e and server using npm install wherever a package.json exists on a new development VM I created shows some deprecated dependencies.

In /server I get:

~/Documents/reactsocialnetwork/server
$ npm install
npm WARN deprecated @npmcli/[email protected]: This functionality has been moved to @npmcli/fs
npm WARN deprecated [email protected]: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x. (Note that the API surface has changed to use Promises in 1.x.)
npm WARN deprecated [email protected]: Jade has been renamed to pug, please install the latest version of pug instead of jade
npm WARN deprecated [email protected]: Deprecated, use jstransformer

In /client I get:

~/Documents/reactsocialnetwork/client
$ npm install
npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-numeric-separator instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-methods instead.
npm WARN deprecated [email protected]: This package has been deprecated and is no longer maintained. Please use @rollup/plugin-terser
npm WARN deprecated @babel/[email protected]: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.
npm WARN deprecated [email protected]: Use your platform's native performance.now() and performance.timeOrigin.
npm WARN deprecated [email protected]: Please use @jridgewell/sourcemap-codec instead
npm WARN deprecated [email protected]: [email protected]
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.

There were no issues installing e2e packages.

I think these are the dependencies of our packages, internal to the npm installs so they reside in node_modules folder(s). On another note, the app runs just fine the way it is. Mind you, I have had issues with svgo in the past, hence the svgo config file in the project root.

Steps to Reproduce

I would say you might make or use a ~/tmp directory, clone or fork the project to it and clean install all 3 sets of packages from /server, /client and /server and see if theres any npm warnings for deprecated packages.

Screenshots

No response

Which device are you using?

Hewlett Packard Enterprise DL360 G7 Server

Which operating system are you using?

Debian 12 VM on VirtualBox

Which browser are you using?

Firefox 118

Additional Context

Not sure how to fix these internal node_module issues with the deprecations.

Any one have any ideas?

Contribute

• I am willing to contribute and submit a pull request

[balajik]

@gbowne1 these warning are not be from the direct dependencies of this project. It is be from internal dependencies of the packages used in both client and server which we can't resolve.

If our dependency package resolves the warning in their setup, then it will be resolve the warning in here after the new version of that package is updated. But some of the warning are from the package which are not actively maintained now. Ex: CRA. this warning "@babel/plugin-proposal-nullish-coalescing-operator" is from create-react-app, but they will not update and release any new version in that package.

[gbowne1]

@balajik I've done this same procedure/process several times over 3-6 months and these warnings are all the same packages.

I am wondering how do we solve this issue.

[balajik]

I think most of the warnings are from CRA which is not maintained anymore.

If we need to fix these warnings, then we have to wait for that package to release a version with fixing the warnings or need to find an alternative of that package which is up-to-date like for example using vite, next.js instead of CRA.

[gbowne1]

Ok. @balajik. Well I know about CRA.

I am not sure what we system we should move to, other than what Facebook was recommending people migrate to.

I've heard some people moved to just setting up their projects with the React package and adding the packages manually like webpack, babel Express, etc. which we could do but might be more work unless we could automate some of it/all of it.

I made a discussion about this in Discussions a while back.

[gbowne1]

The new Docker build system that when merged into this project repository should work way better now! We have also had extensive package updates since this issue happened in late 2023.