Toastify React, error when attempting to use - javascript

When ever I attempt importing tosify into react:
Using the following:
import { ToastContainer, toast } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.css';
I get the following error:
Failed to compile.
./node_modules/react-toastify/dist/react-toastify.esm.mjs
Can't import the named export 'cloneElement' from non EcmaScript module (only default export is available)
Not sure what solution is and have spent alot time trying to find solution but I am unable too, if anything else is needed let me know but when the tosify import not there the site works fine.

Try by changing the version to older version of toastify. Manually add this in your package.json file "react-toastify": "^8.1.0", , and then run npm i then again run npm start.

As stated in this bug report, this seems to be an issue that appears when react-toastify is used with older versions of react-scripts.
Your options are:
upgrade to the newest version of react-scripts (version 5 or above)
downgrade react-toastify to version 9.0.3, which seems to still work with older versions of react-scripts

All you need to do is this
npm i react-toastify#9.0.3

It seems to be some kind of error because of node version. Could you try to reproduce this with latest node version?
Don't forget to remove node_modules and yarn.lock | package-lock.json

I solved by updating my node version and react version,
npm install --save react#latest
npm install -g npm-check-updates
npm audit fix --force

I faced the same issue in React 18.2.0, which was fixed by:
#upgrading to the latest version of react-scripts
npm install react-scripts#5.0.1 # OR npm install --save react-scripts#latest
#if you encounter errors after upgrading.
rm -r node_modules
npm install

I had the same problem, I have tried to update my yarn , and react versions , but the problem was still there.
the best way is to downgrade toastify version to 8.0.0, and it will work.
use this command:
npm i react-toastify#8.0.0
or: if you are using yarn
yarn add react-toastify#8.0.0

Related

npm install material-ui does not install the latest version

I have an abandoned project which is the admin tool for a current project. This project's Material-UI version was 0.19.4. When I delete the dependency from package.json and run npm install, it installs the version "material-ui": "^0.20.2", Also when i edit my package.json, Material-UI's version by hand to version "^1.0.0" the npm crashes: No matching version found for material-ui#1.0.0. What am I missing? Why is the latest version not installed or at least the desired version? Can anyone guide me how to approach the issue?
Side note: When I run the project with the outdated Material-UI, it is not showing as the outdated version.
The newer components are now in #material-ui/core
see: https://material-ui.com/guides/migration-v0x/
npm install #material-ui/core
OR
yarn add #material-ui/core
There are some factors that may be causing the installation to fail. One that I know is maybe the version of npm is not the latest.
Try:
$ npm -g install npm
After that, try installing material-ui again.
That would work.

How to fix "TypeError: fsevents is not a constructor" react error

While staring React app using npm start this error occurred...
I tried below things:
remove node_module package and reinstall
use yarn instead npm
3.update fsevent library using npm
still getting this error
Note: If we create react app fresh/new yarn start will work, but we close the terminal and restart using same thing below error occurred
/Users/nannam/test-app-2/node_modules/chokidar/lib/fsevents-handler.js:28
return (new fsevents(path)).on('fsevent', callback).start();
^
TypeError: fsevents is not a constructor
at createFSEventsInstance (/Users/nannam/test-app-2/node_modules/chokidar/lib/fsevents-handler.js:28:11)
at setFSEventsListener (/Users/nannam/test-app-2/node_modules/chokidar/lib/fsevents-handler.js:82:16)
at FSWatcher.FsEventsHandler._watchWithFsEvents (/Users/nannam/test-app-2/node_modules/chokidar/lib/fsevents-handler.js:252:16)
at FSWatcher. (/Users/nannam/test-app-2/node_modules/chokidar/lib/fsevents-handler.js:386:25)
at LOOP (fs.js:1565:14)
at process._tickCallback (internal/process/next_tick.js:61:11) error Command failed with exit code 1. info Visit
https://yarnpkg.com/en/docs/cli/run for documentation about this
command.
npm audit fix --force
It worked in my case
below steps solved issue :
step 1 : removing node_module and yarn.lock
step 2 : yarn install
step 3 : yarn start
This is a well-documented issue on the react GitHub repo with a couple of options to try.
I solved my error by re-installing the fsevents npm i fsevents, which worked
I solved with
sudo npm i fsevents --unsafe-perm
The #not-a-file gave will work only you can install the fsevents successfully。
but when I do that, I receive an error with this:
Error: EACCES: permission denied, mkdir '/Users/**/node_modules/jest-haste-map/node_modules/fsents/.node-gyp'
So ,I suggest you avoid this by use something like this:
sudo npm i fsevents --unsafe-perm=true --allow-root
And I also find this error may due to node version, when I use node 12,I can not install fsevents successfully , so I use nvm to modify my node version to v11.15.0
👍 Solved it using Yarn's selective dependency resolutions
"resolutions": {
"chokidar": "^3.3.1"
},
as some packages in my dependencies are still on older chokidar versions < 3
I also had the same issue though am using MacOS the issue is kind of bug. I solved this issue by repeatedly running the commands,
sudo npm cache clean --force
sudo npm uninstall
sudo npm install
One time it did not worked but when I repeatedly cleaned the cache and after uninstalling npm, reinstalled npm, the error went off. Am using Angular 8 and this issue is common
Do these simple steps. Run the following
rm -rf node_modules/ package-lock.json
and then
npm i
This worked for me.
For me, downgrading node to v11.15.0 solved the error.
remove node_module and package-lock.json and use yarn instead of npm. This saved me hours.
I deleted the node modules package and reinstalled the node and then executed the node js commands. it worked fine for me.
I FINALLY resolved the issue. The fsevent error occurred right after I installed bootstrap from my VS code terminal. I ended up using the react-bootstrap-github stylesheet code instead and put it in my index.html!
I solved changed my "package.json" using this react-scripts": "2.1.8
I had the same issue. I run the following command and it is working fine now, without using Yarn.
"npm audit fix"
I just solved this issue in node v11.15.0 my solution was: with my "react-scripts" version in "3.0.1" I just update it to "2.1.8" and run npm install after. You can use this version or search for one that works for you. Another option is updating nodejs to the latest version, then remove modules and run npm install.
Currently, we did not found any permanent resolve, but you just create that app again or use yarn package manager to install all modules again in your react app then run yarn start. that's how I solve my issue in react app.
I was able to get it working after running:
$sudo npm install npm#latest -g
I had this issue using the ng serve command. I tried all of the above combinations and none of them seemed to fix this issue permanently. A simple quick fix / get around for me was to close and reopen the terminal.
I had this error TypeError: fsevents is not a constructor and tried all answers (remove node_modules, uninstalling/installing fsevents, sudo npm cache clean --force, sudo npm install/uninstall) listed; but nothing resolved it. For some reason, fsevents is breaking for node version >v10.x.
Regenerating lockfile resolved this issue
npm i --package-lock-only
Run this command
npm install latest-version
Run:
npm audit fix --force
Then, try again.
This often happens due to the continuous update to react and npm-packages.
Try to remove your node_modules
npm uninstall
delete your yarn.lock
this will save tons of time and if you are using npm instead if yarn
always updated.
run yarn install
After trying "npm audit fix --force" did not work , I tried:
Removing node_modules folder
npm i
worked for me

Module not found: Can't resolve '#material-ui/core/Container'

In the browser, I get the error
Failed to compile Module not found: Can't resolve
'#material-ui/core/Container'
It's looking for the component inside of my components directory instead of node_modules. I can't change directories into node_modules ../../ because node_modules is outside of src directory and Create React App won't let me.
I've use yarn to remove and $ yarn add #material-ui/core. I've tried yarn run build which gives me the error
Cannot find module: '#material-ui/core/Container'. Make sure this
package is installed. You can install this package by running: yarn
add #material-ui/core/Container.
When I try to add it, I get the error
error Couldn't find package "#material-ui/core/Container" on the "npm"
registry.
Here's the dependencies I have that are related:
"#material-ui/core": "^3.9.3",
"#material-ui/icons": "^3.0.2",
"react": "^16.8.6",
"react-dom": "^16.8.6",
I expect to see the contents of the page not take up the full width of the screen, but instead, I receive a fail to compile error.
Container is not part of the material-ui version specified in your package.json.
To upgrade, run the following:
$ yarn add #material-ui/core#next
You might have to remove the old stable version (if that's even an option for you).
React and react-dom >= 16.8.0 are all that are needed as peer dependencies, so the experimental upgrade of material-ui should be all you need to use Container.
I had a similar issue and I resolved it by calling:
for npm:
npm install #material-ui/core
for yarn:
$ yarn add #material-ui/core#next
If you follow a npx create-react-app new-app with cd new-app and yarn add #material-ui/core it wile compile with yarn start. You might try just starting over.
However, to help your troubleshooting, this error typically happens when you try to use a Material-UI component and forget to import it. Have you tried commenting out all the code and seeing if it compiles?
This error might also indicate that there are no node_modules for what is being imported. So, npm install might solve the problem.
Just install these below packages
#emotion/react
#emotion/styled
#material-ui/core
#material-ui/icons
Just Install: npm install #material-ui/core
This problem is caused by the same material UI package you have installed, latest MUI package is written as #mui/package-name and I installed material-ui-dropzone package and this package does not adapt to new material UI name conversion means it uses the old naming conversion of MUI, for example, #material-ui/package-name
The solution for this problem will be to install core material UI and other MUI packages using the old naming conversion for example #material-ui/core or #material-ui/icons instead of #mui/core or #mui/icons
For those trying to upgrade to Material Ui v5 (MUI v5)
See this section of the migration doc to v5.
Some imports have changed name (not just the prefix)
#material-ui/core -> #mui/material
#material-ui/unstyled -> #mui/base
#material-ui/icons -> #mui/icons-material
[...]
you haven't installed Material-UI for the correct path.
step 1:
If windows-PC selects the correct path using terminal -> cd .\foldername
step2:
install Material-UI
// with npm
npm install #material-ui/core
// with yarn
yarn add #material-ui/core

Updating an existing package's dependency version?

I'm on Ubuntu 14.04 trying to install this package: https://www.npmjs.com/package/stanford-corenlp
However, whenever I try to do so, it tries to install node-java 0.5.5 as a dependency which fails (gives me node-gyp errors).
I looked this issue up, and it's fixed by using a newer version of node-java. 0.6.1 seems to work fine, but I don't know how to update the dependency to install the stanford-corenlp package.
add
"node-java": "^0.6.1"
in 'dependencies' of your package.json file. Then run npm install. This will install the right version of node-java.
Then try to install standford-corenlp. If they didn't hardcode the node-java version in their package.json, you should be alright

npm install specific version does not install specific version

My package.json says I have react-router: 0.13.4 installed. However, when I type in the command npm view react-router it stats that it is using version: '1.0.0-rc3
I even tried npm install react-router#0.13.4 but npm view react-router still produces version 1.0.0-rc3
I believe npm view shows details of the latest remote package release, not the installed version. Look at node_modules/react-router/package.json to see your installed version. Use the npm install react-router#0.13.4 --save command if you want to update your package.json file.
npm install react-router-dom#5.3.0
then check the version in terminal with npm view react-router-dom#5.3.0 version
it will show the version of react router.
If you look at the react-router versioning on their GitHub releases page, you will notice there is no version 0.13.4 after version 0.13.3, which might be why NPM defaults to installing the latest version 1.0.0-rc3.

Categories