Loading with webpack

[Wouter]

The following error occurs when I try to load a component trough webpack (I beautified the minified script with js-beautify for this):

ej.core.min.js:359 Uncaught TypeError: Cannot read property 'extend' of undefined
    at ej.core.min.js:359
    at Object.<anonymous> (ej.core.min.js:842)
    at window.ej.window.Syncfusion (ej.core.min.js:12)
    at Object.<anonymous> (ej.core.min.js:13)
    at Object.<anonymous> (main.bundle.js:16298)
    at __webpack_require__ (bootstrap 4d9a844…:19)
    at ej.globalize (ej.globalize.min.js:10)
    at Object.<anonymous> (ej.globalize.min.js:10)
    at Object.<anonymous> (ej.globalize.min.js:10)
    at __webpack_require__ (bootstrap 4d9a844…:19)
(anonymous) @ ej.core.min.js:359
(anonymous) @ ej.core.min.js:842
window.ej.window.Syncfusion @ ej.core.min.js:12
(anonymous) @ ej.core.min.js:13
(anonymous) @ main.bundle.js:16298
__webpack_require__ @ bootstrap 4d9a844…:19
ej.globalize @ ej.globalize.min.js:10
(anonymous) @ ej.globalize.min.js:10
(anonymous) @ ej.globalize.min.js:10
__webpack_require__ @ bootstrap 4d9a844…:19
t.widget.element @ ej.datetimepicker.min.js:10
(anonymous) @ ej.datetimepicker.min.js:10
(anonymous) @ ej.datetimepicker.min.js:10
__webpack_require__ @ bootstrap 4d9a844…:19
(anonymous) @ main.js:39
__webpack_require__ @ bootstrap 4d9a844…:19
(anonymous) @ module.js:22
__webpack_require__ @ bootstrap 4d9a844…:19
(anonymous) @ bootstrap 4d9a844…:65
(anonymous) @ bootstrap 4d9a844…:65

Screenshot of state right before error:


My main script:

'use strict';

var $ = require('jquery');

require('jquery.easing');

require('jsrender')($);

require("syncfusion-javascript/Scripts/ej/web/ej.datetimepicker.min.js");

Webpack output:

>webpack --display-modules
clean-webpack-plugin: C:\SRC\EXP\wp\dist has been removed.
Hash: 62f02a0c543841c3e9a3
Version: webpack 2.2.0
Time: 802ms
             Asset    Size  Chunks                    Chunk Names
    main.bundle.js  698 kB       0  [emitted]  [big]  main
main.bundle.js.map  857 kB       0  [emitted]         main
   [0] ../~/jquery/dist/jquery.js 293 kB {0} [built]
   [1] ../~/syncfusion-javascript/Scripts/ej/common/ej.core.min.js 52.8 kB {0} [built]
   [2] ../~/syncfusion-javascript/Scripts/ej/common/ej.globalize.min.js 16.3 kB {0} [built]
   [3] ../~/syncfusion-javascript/Scripts/ej/common/ej.scroller.min.js 37.3 kB {0} [built]
   [4] ./main.js 5.18 kB {0} [built]
   [5] ../~/jquery.easing/jquery.easing.js 4.05 kB {0} [built]
   [6] ../~/jsrender/jsrender.js 79.9 kB {0} [built]
   [7] ../~/syncfusion-javascript/Scripts/ej/common/ej.touch.min.js 8.94 kB {0} [built]
   [8] ../~/syncfusion-javascript/Scripts/ej/web/ej.datepicker.min.js 76.3 kB {0} [built]
   [9] ../~/syncfusion-javascript/Scripts/ej/web/ej.datetimepicker.min.js 67.5 kB {0} [built]
  [10] ../~/syncfusion-javascript/Scripts/ej/web/ej.timepicker.min.js 48.3 kB {0} [built]
  [11] multi ./main.js 28 bytes {0} [built]

How to resolve?

[Francis Paul Antony Raj]

Hi Wouter, 

 

We have checked your error report and suspect that issue might be occurs due to problem in configuration files. We have prepared a simple sample based this. Can you please check it in the below link: 

https://www.syncfusion.com/downloads/support/forum/128615/SYNCFU~1-752269222.ZIP 

 

If still you have any issues, please share the configuration files or revert the sample to reproduce the issue at our end. This will be helpful for us to anaylyze and provide a solution at the earliest. 

 

Regards, 

Francis Paul A. 

[Wouter]

Thanks! Switching to typescript and using import instead of require for the syncfusion components seems to do the trick for me.

[Francis Paul Antony Raj]

Hi Wouter, 

 

Thanks for the update. 

 

Please get back to us if you need further assistance. 

 

Regards, 

Francis Paul A. 

[Wouter]

Using @types/ej.web.all I get this error:

ERROR in [at-loader] node_modules\@types\ej.web.all\index.d.ts:17:16
    TS2300: Duplicate identifier 'ej'.

ERROR in [at-loader] node_modules\@types\ej.web.all\index.d.ts:39987:16
    TS2300: Duplicate identifier 'ej'.

In the latest version its located here I think: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/14592/files#diff-321d19571887f0d056583bd832e9672fR42352

Could you fix this before releasing the 15.1.33 version?

[Sarath Kumar P]

Hi Wouter,  

  

We have prepared a sample for simple DatePicker with index.d.ts file loaded from @types/ej.web.all (Using npm install @types "ej.web.all") and the reported issue was not occurred. 

 

Sample: https://www.syncfusion.com/downloads/support/forum/128615/ze/TypeScriptHTMLApp1-1554511376 

 

Can you please explain us the exact scenario in which you are getting the reported errors or reproduce the reported errors in the attached file and update us to resolve it. 

  

Regards,  

 

Sarath Kumar P. 

[zzh]

Hi

I got issue when use ej.daterangepicker，

the problem occurs when import daterangpicker js only,  currently i delete 'this.__extends' above to fix this issue, looking forward for a official update to fix this.

[Wouter]

Hi Sasikala,

Last question was from zzh, I'm already using 15.2.0.40

[Sasikala Nagarajan]

  

Hi Wonter,   

 Sorry, mistakenly we have addressed to you.  

Regards,   

Sasikala Nagarajan   

[Sasikala Nagarajan]

 Hi Zzh, 

Sorry for the inconvenience caused, 

We have checked with your reported query and we would like let you know that, we have already fixed this issue with our latest version (15.2.0.40). Please check with the updated DateRangePicker file and let us know. 

Please get back to us to you need any further assistance, 

Regards, 

Sasikala Nagarajan