Silverstripe Version: 4.7.2
Question:
How to use laravel-mix/webpack in theme in combination with modules and required javascript correctly?
I´m trying to use the Silverstripe CMS Elemental module and various other block modules and got problems with the js of the dynamic/flexslider module in combination with my theme (silverstripe-bootstrap-mix).
After packing all required files in my theme via npm run, and exposing all vedor-files via composer vendor-expose i got the error
Uncaught TypeError: jQuery(...).eq(...).flexslider is not a functionThis message is clear: the js-file of the module dynamic/flexslider is not loaded correctly. But in the debug-scetion of the browser dev-tools, there are both js-files jquery-3.5.1.js and jquery.flexslider.js are loaded (screenshot-1 below). They are referenced in the Page.ss in the theme via
<% require javascript('//code.jquery.com/jquery-3.5.1.js') %>
<% require javascript('dynamic/flexslider: thirdparty/flexslider/jquery.flexslider.js') %>They are not packed via webpack as part of the laravel-silverstripe-bootstrap-mix. And this is my detailed question: if i add jquery.flexslider.js in the webpack-script, the slider is working - everything is fine (screenshot-2 below). But i can not imagine, to put javascript-files from composer-installed modules in any package-script of my theme, should i? Where is my mistake?
Best regards,
chrclaus
Screenshots:
1.) error message and debug-screen of loaded js-files:
2.) working version with added js to webpack:
Additional comment: the url of js-files are correct in both versions since the browser is able to show the correct content of the files.