Cannot use MUI 'ContentCopy' icon - reactjs

I am trying to use the icon 'ContentCopy' from MUI.
https://mui.com/components/material-icons/ says to use the following import:
import ContentCopyIcon from '#mui/icons-material/ContentCopy';
No matter what I do, I get the error:
Module not found: Can't resolve '#mui/icons-material/
I have already tried the following:
npm install #material-ui/core
npm install #material-ui/icons
I also tried deleting my node-modules and re-running npm install.
Any ideas on what else I could try??

It seems that you confused of using version 4 and 5.
You need to install the icons of version 5.
npm install #mui/icons-material
And import the icon from the module.
import ContentCopyIcon from '#mui/icons-material/ContentCopy';
Please refer to this.

to version 5 you need to install mui
npm install #mui/icons-material
mui contains all the icons
from '#mui/icons-material/_';
info https://www.npmjs.com/package/#mui/icons-material

Related

Not able to install #mui/icons-material through npm

Not able to install #mui/icons-material
When I try to install material ui icons dependency it got stuck for a long time showing like this:
# client**>npm install #mui/icons-material
[##############....] \ reify:fsevents: sill reify mark deleted [
I also cleared the cache using npm cache clean --force but it didn't work.
How can I come out of this problem?
Install Material UI core
npm install #mui/material #emotion/react #emotion/styled
After installing it install the icons package by running
npm install #mui/icons-material
If you have material-ui/core v4 upgrade it to the latest one and for that, you also need to update react to at least v17 because the minimum requirement for v5 of material-ui is v5.

react-native-gesture-handler package error on new app

Hey I'm new to react native :) I get this error once I added react navigation to my app
I try to use navigate in react-native.. I added : npm install --save react-navigation
but it gives me an error like this :
\node_modules#react-navigation\native\src\Scrollables.js: Module
react-native-gesture-handler does not exist in the Haste module map
You need to install react-native-gesture-handler as well separately in the project dependency list and link it too with native as well. Please refer to this doc.
use the following command to install
if you are using yarn
yarn add react-native-gesture-handler
if you are using npm
npm i -s react-native-gesture-handler

How to use bootstrap-notify in react

i want to use http://bootstrap-notify.remabledesigns.com/ in my react app, i have tried to follow Using bootstrap-notify with Angular 7 but getting error "$.notify is not a function" in console
You need the necessary imports:
import $ from "jquery";
import "bootstrap-notify";
You will need to load them using npm i jquery --save and npm i bootstrap-notify --save. I also had some compiler errors after installing, which I fixed with: (see here)
npm install --save --save-exact react-scripts#3.4.0

Can't resolve radium

I am new to React Environment, and was going through a tutorial and tried to install Radium for css pseudo behaviour using visual integrated terminal.
npm i --save radium
the radium has been installed and added to the package.json
but after making changes and saving compilation has been failed and throwing the following error.
Module not found: Can't resolve './../../webpack/buildin/global.js' in 'D:\maximillian-react\react-complete-guide\node_modules\radium\es'
What went wrong?
and Thanks in advance
npm install --save radium --force
Oh, It's really bad but I found what went wrong, I just installed the dependencies using
npm install
and everything is working fine.
After installing Radium stop your React development server ctrl+c and then run:
yarn start
or
npm start
If necessary, before restarting development server run:
npm install
as well and that will fix any missing dependencies.
check the syntax for your import for importing radium in respective components the correct syntax I have attached in the code snippets . please do check
import Radium from 'radium'

How to install latest version of fontawesome using npm in react js?

I want to use the latest fontawesome version. but i cannot install using npm. How to install the fontawesome latest version(5.0.10) using npm?
I tried like this
npm i #fortawesome/fontawesome
It will always install latest version by default. However you can force package manager to install specified version too.
Just run
npm i #fortawesome/fontawesome#5.0.10 --save
You need to add --save for it to also show up in package.json
or by using yarn
yarn add #fortawesome/fontawesome#latest
just use this command
npm i fontawesome#5.0.10 --save
You need to add --save for it to also show up in package.json
We are actually at 5.0.13 as of today. We also have some pre-release files for 5.1 that improve things quite a bit.
You can install the pre-release version like this:
npm install --save #fortawesome/fontawesome-free
If you are a Pro subscriber and you've configured NPM to use our private NPM repository you can do this:
npm install --save #fortawesome/fontawesome-pro
And finally if you want to install the latest 5.0.x version:
npm install --save #fortawesome/fontawesome-free-webfonts
or
npm install --save #fortawesome/fontawesome-pro-webfonts
Also note that everything that comes from Font Awesome officially will be under the #fortawesome scope.

Resources