Topic: Importing Parallax plugin with ES format. How?
webservices pro premium priority asked a year ago
We are importing MDB with ES format as described in the Migrating to MDB v7 docs and everything works except Parallax. This is currently the only plugin we are using.
I've seen a couple others here say ES format was not working with plugins. I don't see how they were able to get it working though.
What am I doing wrong?
import {
Button,
Offcanvas,
... more modules
initMDB,
} from 'mdb-pro-directory/js/mdb.es.min.js';
window.Button = Button;
window.Offcanvas = Offcanvas;
... more modules
initMDB({
Button,
Offcanvas,
... more modules
});
// Parallax module.
import Parallax from 'mdb-pro-directory/src/plugins/parallax/js/parallax.js';
window.Parallax = Parallax;
initMDB({Parallax});
Kamila Pieńkowska staff answered a year ago
initMDB
is a method needed for components. Please remove this part of your code. Parallax is a separate module.
This is the easiest way to import a single plugin:
<script type="text/javascript" src="mdb-pro-directory/plugins/js/parallax.min.js"></script>
If you prefer the way you do please let me know if you get any errors after removing:
initMDB({Parallax});
webservices pro premium priority commented a year ago
Thank you for the clarification. Sorry I did not mention that this is in a Webpack build. I would like to keep it in the build process if possible so that it is in manifest.json
.
Do you have any recommendations for how to include it in Webpack?
Grzegorz Bujański staff commented a year ago
Try using the same code but without initMDB({Parallax});
webservices pro premium priority commented a year ago
Thanks. Unfortunately there were errors during the build process that prevented the build from finishing. I ended up doing what you said so that I could load the script only when there is a parallax on the page. I used Webpack to copy parallax.min.js
in to my build directory. Then I just add the script to the page when it is needed. It works out better than how I was originally going to do it :-)
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 7.1.0
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: Yes