I have a jhipster generated gateway app. I have jquery plugin added to in webpack.dev.js
There is one scripts.js which stays in assets folder , I have included that script by adding its entry in vendor.ts. and now I can see that its in bundled in main.bundle.js
The content of that script is :
jQuery.widget.bridge('uibutton', jQuery.ui.button);
//receive calls from typescript code to update the layouts
var AdminLTE = (function() {
return {
init: function() {
jQuery(function(){
jQuery.AdminLTE.layout.activate();
jQuery.AdminLTE.layout.fix();
jQuery.AdminLTE.layout.fixSidebar();
});
}
}
})(AdminLTE||{});
and in my component.ts, I have code like this :
declare var AdminLTE: any;
export class AdminDashboard1Component implements OnInit {
------------
ngOnInit() {
// Update the AdminLTE layouts
AdminLTE.init();
----------
}
When I load the app, the breakpoints gets hit at line 1 of scripts.js and complaints
Cannot read property 'bridge' of undefined
where our jQuery works at other places in the app.
If I comment this line, and let the app go ahead, it halts at AdminLTE.init() in component.ts, where it complains
variable AdminLTE not found.
Oh!! the Very first line of the very first file app.module.ts import ./vendor.ts
explains everything..