Cannot Import Material UI In React - node.js

I have installed #material-ui/icons using npm but anytime i run an import for
PS: I have Installed #material-ui/icons
import AccountCircleIcon from '#material-ui/icons/AccountCircle';
I get the following error
Failed to compile.
./node_modules/#material-ui/icons/utils/createSvgIcon.js
Module not found: Can't resolve '#material-ui/core/SvgIcon' in '/home/freduah/react-amazon-clone/node_modules/#material-ui/icons/utils'

Do you have Material Icons?
// with npm
npm install #material-ui/icons
// with yarn
yarn add #material-ui/icons
Check following page.
https://material-ui.com/components/icons/

As far I know you should have installed Material-UI itself. Because icons using SvgIcon components from the core package.
https://material-ui.com/components/material-icons/:
converted to SvgIcon components.
How to install the core package:
https://material-ui.com/getting-started/installation/
// with npm
npm install #material-ui/core
// with yarn
yarn add #material-ui/core`

Related

How to use 2 different versions of the same node dependency in package.json?

I am working on a react js application where I am using Material-UI v5.0.0 for my UI components.
This new version replaces the package names from #material-ui/* prefix with #mui/*:
#material-ui/system -> #mui/system
#material-ui/styles -> #mui/styles
#material-ui/lab -> #mui/lab
In my project I am also using another dependency for displaying a calendar on 1 page which has a peer dependency of Material-UI v4.12.3 which imports material libraries like #material-ui/system.
How should I manage my dependencies in package.json so that I can use Material-UI v5.0.0 for majority of my UI/UX and still be able to use the dependency just for a specific UI screen.
Should I npm install both material UI v5.0.0 and v4.12.3 or is there a better way of doing this ?
With npm or yarn you may install specific packages under aliased names enabling you to use the same package under two different versions to do so you may
npm install <alias>#npm:<pkg_name><#version> # for npm
yarn add <alias>#npm:<pkg_name><#version> # for yarn
Example:
Installing Material-UI
npm install v5n#npm:#mui/material#5.0.0
npm install v4n#npm:#mui/material#4.12.3
Then you may require them as
import Button from 'v5/Button';

Can't get vue cli 4 to find dependencies

So I installed vue cli 4.1.1 to get a new project going. I select manual setup so I can pick what I need. But when I try to run "npm run serve" I get the following error:
ERROR Failed to compile with 4 errors 10:59:53 These dependencies were not found: * #/components/HelloWorld.vue in C:/Program Files/nodejs/node_modules/#vue/cli-service-global/node_modules/babel-loader/lib??ref--12-0!C:/Program Files/nodejs/node_modules/#vue/cli-service-global/node_modules/cache-loader/dist/cjs.js??ref--0-0!C:/Program Files/nodejs/node_modules/#vue/cli-service-global/node_modules/vue-loader/lib??vue-loader-options!./views/Home.vue?vue&type=script&lang=js& * register-service-worker in ./registerServiceWorker.js * vue-router in ./router/index.js * vuex in ./store/index.js To install them, you can run: npm install --save #/components/HelloWorld.vue register-service-worker vue-router vuex
All the files are at the right place. I havn't done anything to the project besides removing node_modules and reinstalling it with "npm install". (Had to do this to get rid of another error)
I am runnig Windows 10, Node 10.15.1, NPM 5.0.4 and vue-cli 4.1.1
What troubles me the most is that it's just regular vue files and not packages. Why it suggests that I should install them with npm install is something I find odd.
As you chose manual option you have to create a file in components directory name as HelloWorld.vue
After the above step run npm install --save register-service-worker vue-router vuex
Have you run this command as described.
npm install --save #/components/HelloWorld.vue register-service-worker vue-router vuex

Adding types when using tfjs-node

I would like to install the types when using tensorflow/tfjs-node as I'm using Typescript.
I installed it via npm install #tensorflow/tfjs-node
But non of them are working to install the typings:
npm install --save #types/tensorflow/tfjs-node
npm install --save #types/tfjs-node
You don't need to install the types separately as they come already bundled with the main repository.
To remove the old typings from #types/... use npm uninstall. After that, When using TypeScript and importing the data via import it should automatically pick up the correct types.

KendoUI Angular2 Can I install all the components?

I hope. Kendo Grid, Combobox, treeview ... Kendo all package !
KendoUI Angular2 Can I install all the components?
npm install --save #progress/kendo-angular-buttons #progress/kendo-angular-l10n #angular/animations #progress/kendo-angular-grid #progress/kendo-angular-dropdowns #progress/kendo-angular-inputs #progress/kendo-angular-dateinputs #progress/kendo-data-query #progress/kendo-angular-intl #progress/kendo-drawing #progress/kendo-angular-excel-export
I do not want this method.
For example, "npm install --save #progress/kendo-ui-angular-allpackage"
Is there any way to do this?
As per the documentation you have to install kendo plugin using these dependencies
npm install --save #progress/kendo-angular-buttons #progress/kendo-angular-l10n #angular/animations
Reference from here
http://www.telerik.com/kendo-angular-ui/getting-started/
There is no dependency under the package name of
npm install --save #progress/kendo-ui-angular-allpackage
According to me Kendo use the pattern of angular like angular did seprate the code in different folders so
when need we need to install using particular package like #angular/router etc.

Npm package has too many dependencies

Im new to this all npm thing and I have a question about dependencies.
I started the React tutorial and I have been asked to run the following command:
npm install -g create-react-app
also, for a side project I also rn this following command in the same directory:
npm install react-chartjs-2 chart.js
And suddenly, my node_modules contains 800+ folders of packages.
So I found this site that tells you how many packages your package depends on and it showed me that I depend on only 100+ packages.
I know the meaning of npm install.
I find it really unexplainedable, I will appreaciate any help from your side.
Thank you very much.
install npm-remote-ls globally and check the dependencies of any package you want
npm install npm-remote-ls -g
checking react dependencies: npm-remote-ls react

Resources