Topic: \"Uncaught ReferenceError: $ is not defined\" JavaScript error when using MDBootstrap WebPack Development Environment
Chris Smith pro asked 6 years ago
<script type="text/javascript"> new WOW().init(); $(".button-collapse").sideNav(); varsideNavScrollbar = document.querySelector('.custom-scrollbar'); Ps.initialize(sideNavScrollbar); </script>I get an Uncaught ReferenceErrors for both wow.js and sideNav. Any ideas? I verfied that app.js was being defined as an entry point in my webpack.config.js file, and that app.js imports the "../vendors/mdb/js.mdb" file, which subsequently has the references to wow.js and sideNav. WebPack runs without errors, builds the project, and runs it via the WebPack Dev Server. The page loads with the correct styles and components. I only fins the errors when debugging the JavaScript in the browser (Chrome). The SideNav components also do load correctly, so the navbar formatting is a bit off. I think this is an issue with the WebPack config file as no JavaScript initializations seem to be working. To confirm, this is the WebPack configuration file straight off the "Getting Started" part of this site. Finally, I am using the Pro version of MDB and have verified that mdb in the vendors folder has the correct Pro version.
Jakub Mandra staff answered 6 years ago
Jakub Mandra staff answered 6 years ago
Chris Smith pro commented 6 years ago
Hi Jakub, I am using WebPack, so I am not importing it within the html itself, but as part of the WebPack configuration file. Here is the portion of the plugin code from my WebPack Configuration file: new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', 'window.$': 'jquery', 'window.jQuery': 'jquery', Waves: 'node-waves', }),FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Pro
- Premium support: No
- Technology: Other
- MDB Version: -
- Device: Desktop
- Browser: Chrome
- OS: macOS
- Provided sample code: No
- Provided link: No