Author Topic: WebPack + TypesScript + PQGrid  (Read 3050 times)

khadden

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 4
    • View Profile
WebPack + TypesScript + PQGrid
« on: February 01, 2019, 06:36:23 am »
I'm in the process of converting our old legacy js project over to typescript and bundling with webpack and am having problems the PQ Grid Pro v2.0.0 (I know we are on an old version).
But I believe the problem is really with how the new version of JQuery UI is packaged on NPM. I.e. each widget being a separate module. But I would like to know which UI widgets and whatnot are required by PQ Grid? So I can import them into my modules that use PQ Grid.

Currently I get a runtime error: b.widget is not a function from pqgrid.min.js line 9.


khadden

  • Pro Enterprise
  • Newbie
  • *
  • Posts: 4
    • View Profile
Re: WebPack + TypesScript + PQGrid
« Reply #1 on: February 21, 2019, 04:45:24 am »
I'm in the process of converting our old legacy js project over to typescript and bundling with webpack and am having problems the PQ Grid Pro v2.0.0 (I know we are on an old version).
But I believe the problem is really with how the new version of JQuery UI is packaged on NPM. I.e. each widget being a separate module. But I would like to know which UI widgets and whatnot are required by PQ Grid? So I can import them into my modules that use PQ Grid.

Currently I get a runtime error: b.widget is not a function from pqgrid.min.js line 9.


Anyone have any advice?

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6310
    • View Profile
Re: WebPack + TypesScript + PQGrid
« Reply #2 on: February 21, 2019, 09:15:51 am »
First npm install jquery and jqueryui.

Then import or require the below modules.

Code: [Select]
var jQuery = require('jquery');
    require('jquery-ui');
    require('jquery-ui/ui/widgets/mouse');
    require('jquery-ui/ui/widgets/sortable');
    require('jquery-ui/ui/widgets/button');
    require('jquery-ui/ui/widgets/resizable');
    require('jquery-ui/ui/widgets/draggable');
    require('jquery-ui/ui/widgets/droppable');
    require('jquery-ui/ui/widgets/tooltip');
    require('jquery-ui/ui/widgets/autocomplete');