Topic: How install React Plugins such as mdb-react-fileupload
I have MDB React Pro Bundle with all Plugins.
When I use import MDBFileupload from 'mdb-react-fileupload';
I get Module not found: Can't resolve 'mdb-react-fileupload' in '/Users/ ... /src
I've tried many things in package.json, removing yarn.lock and node_modules, and following multiple forum posts. Nothing helps. I have a fairly simple and clean create-react-app environment.
I'm loading mdt-react this way "mdbreact": "git+https://oauth2:MY_TOKEN@git.mdbootstrap.com/mdb/react/re-pro.git",
What is the proper way to install plugins? Isn't there a simple and documented solution that doesn't involve manually copying dependencies from one package.json to another?
So what does that exactly mean? This is taking days to answer what I thought was a straight-forward question.
What is the full and specific set of instructions for installing and referencing a plug-in (up through the import statement in my React code).
Piotr Glejzer staff commented 3 years ago
We don't have an instruction for plugins installation but if you have an mdb-react-plugin-ack-new you have to unpack all packages and if you want to use some of these you need to create a package with npm pack command and copy and paste this package into your project and add into dependencies for example "mdb-react-calendar": "./mdb-full-calendar-4.26.1.tgz".
@Piotr Glejzer, here's a partial directory listing:
$ ls m* M*
MDB_README.txt mdbreact-5.0.1.tgz
MDB-React-Admin-Pro:
License.pdf package-lock.json public/ src/
mdbreact-5.0.1.tgz package.json source-pack/
MDB-React-Plugin-Pack-New:
MDB-React-Calendar/ MDB-React-FileUpload/ MDB-React-Sortable/ MDB-React-WYSIWYG/ license.pdf*
MDB-React-Color-Picker/ MDB-React-Filter/ MDB-React-Table-Editor/ README.md*
Also, I just ran npm list and was surprised about the mdbreact error (the log has no additional information).
$ npm list
(node:58882) ExperimentalWarning: The fs.promises API is experimental
your-app@0.1.0 /Users/xxxxx...
├── @aws-amplify/ui-react@1.0.2
├── aws-amplify@3.3.20
├── mdbreact@5.0.1 invalid
├── react-data-table-component@7.0.0-alpha-5
├── react-dom@17.0.1
├── react-router-dom@5.2.0
├── react-scripts@4.0.1
├── react@17.0.1
├── renamer@1.1.4
├── rimraf@2.7.1
└── styled-components@5.2.1
npm ERR! code ELSPROBLEMS
npm ERR! invalid: mdbreact@5.0.1 /Users/xxxxx.../node_modules/mdbreact
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/xxxx.../.npm/_logs/2021-02-22T13_32_13_388Z-debug.log
Here's part of my package.json:
"dependencies": {
"@aws-amplify/ui-react": "^1.0.2",
"aws-amplify": "^3.3.20",
"mdbreact": "git+https://oauth2:XXXXXXXXX...XXXXX@git.mdbootstrap.com/mdb/react/re-pro.git",
"react": "^17.0.1",
"react-data-table-component": "^7.0.0-alpha-5",
"react-dom": "^17.0.1",
"react-router-dom": "^5.1.2",
"react-scripts": "4.0.1",
"styled-components": "^5.2.1"
},
My app is otherwise working fine.
Piotr Glejzer staff commented 3 years ago
so if you want to use a plugin you have to use it from the zip package, we don't have these plugins in re-pro repository
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 5.0.1
- Device: Mac
- Browser: Chrome
- OS: Mac OS
- Provided sample code: Yes
- Provided link: No
Piotr Glejzer staff commented 3 years ago
do you have folder plugins in your bundle?