Angular 2 and WebPack, vendor.ts configuration

[jfabianParticipant]

Is there an example of using the widgets with Angular 2 components with WebPack WITHOUT using AOT and WITHOUT placing the scripts on the page and using just vendor.ts?

I don’t have any issues with my own components or other libraries so I do understand how the imports work but I haven’t been able to figure out how to get the widgets wot work with Angular 2.

Am I forced to use the WebPack with AOT and also force to place scripts on the page?

I’m getting an error, jqxBaseFramework is not defined if I don’t include jqx-all, if I do include it then the events don’t seem to fire with the list controls and the grid throws error about the DataAdapter not being defined although all the controls do render.

What files are required for this to work in vendor.ts

Here is vendor.ts, Is this correct?

// Angular
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';

// RxJS
import 'rxjs';

//scripts
import 'jquery';
import 'jqwidgets-framework/jqwidgets/jqxcore';
import 'jqwidgets-framework/jqwidgets/jqxdropdownlist';

//css
import 'jqwidgets-framework/jqwidgets/styles/jqx.base.css';
import 'jqwidgets-framework/jqwidgets/styles/jqx.black.css';

[Ivo ZhulevParticipant]

Hi jfabian,

There is no example and it looks okay. But as I said in this topic, it is a missed import or wrong path for sure.

I encourage you to use AOT because it shows a lot of problems that are not visible otherwise and it makes the application MUCH faster.

Best Regards,
Ivo

jQWidgets Team
http://www.jqwidgets.com/

[jfabianParticipant]

Ok, that makes sense, I was trying to ease into angular and keep it as basic as possible but if it is going to help with troubleshooting issues then I should give it a try. I’ll post my outcome.

Thank you very much!!

[Author]

Posts