Webpack support

8 posts, 1 answers
  1. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 03 May Link to this post

    I'm trying to use webpack with kendo, but the bundled file is almost 20mb, which is much bigger than the 2.7mb of kendo.all.

    Webpack configuration follows the one presented in http://docs.telerik.com/kendo-ui/third-party/webpack but still, the resulting bundled file is almost 20mb. Without kendo, my application, wtihout kendo, is just over 3mb… Why the final bundled application is adding 17mb just because kendo is included since the kendo.all.min.js (pro version) is below 3mb?

    I've tried to include kendo.all.min.js as an alias in webpack:


    alias: {
      “kendo”: path.join(__dirname, “third-party/kendo/kendo.all.min.js”),


    And then importing it in our app:

    import ‘kendo’;

    But then webpack is not able to resolve the dependencies of the controls (if we are using for example kendo-grid).

    Importing just a control didn’t work either:
  2. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 03 May in reply to Daní Link to this post

    The only working solution is including kendo.all.min.js in the index.html file as it is presented in http://docs.telerik.com/kendo-ui/third-party/webcomponents, but this is not an option for the project.
  3. UI for ASP.NET AJAX banner
  4. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 05 May Link to this post

    Hello,

    this sounds weird. We haven't observed such behavior with webpack. May you replicate the problem in an isolated case? You may strip the Kendo UI scripts to reduce the archive size. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 05 May in reply to Petyo Link to this post

    Thanks Petyo for your response,

     

    The ecosystem of the application it's a bit complex. I'm using aurelia framework with webpack + polymer for basic widgets. I'd like to use some professional kendo widgets like grid or scheduler.

     

    I'll try to isolate the issue in a demo project with just aurelia +webpack + kendo

  6. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 05 May in reply to Petyo Link to this post

    Petyo said:Hello,

    this sounds weird. We haven't observed such behavior with webpack. May you replicate the problem in an isolated case? You may strip the Kendo UI scripts to reduce the archive size. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     

    Hi Petyo,

     

    Whato do you mean with "You may strip the Kendo UI scripts to reduce the archive size."

  7. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 05 May in reply to Daní Link to this post

    Hi again,

    this link demo points to a GitHub repo with an small example of an aurelia + webpack app with a single view that uses a kendo grid. You have to copy kendo ui *.min.js file into the folder third-party/kendo/js before running the app (please, follow the readme guide)

    Using *.min.js kendo files instead of *.js we can achieved to reduce bundle size to 12MB instead of 18, anyway resulting is still to huge

     

    Thansk

     

  8. Answer
    Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 09 May Link to this post

    Hi,

    We don't provide official support for Aurelia, and I suspect that the problem may be caused by its internals. Is it possible to replicate the problem starting from the setup we provided on our documentation

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  9. Daní
    Daní avatar
    303 posts
    Member since:
    Feb 2008

    Posted 12 May in reply to Petyo Link to this post

    I finally could find the issue. It was related with babel transpiler, setting babel option "compact" to true fixed the issue and now adding kendo adds just 1Mb to the bundler
Back to Top
UI for ASP.NET AJAX banner