New AMD definitions in v2016.1.112 are incompatible with webpack

Thread is closed for posting
8 posts, 0 answers
  1. Jack
    Jack avatar
    100 posts
    Member since:
    Jan 2007

    Posted 13 Jan Link to this post

    In 2015.3.1113, kendo.menu definition was

    (function(f, define){
        define([ "./kendo.popup" ], f);
    })(function(){
     
    (function(){
     
    ...
     
    })();
     
    return window.kendo;
     
    }, typeof define == 'function' && define.amd ? define : function(_, f){ f(); });

    This did work with webpack. 

    In 2016.1.112, kendo.menu definition has been changed to:

     

    (function (f, define) {
        define('kendo.menu', ['kendo.popup'], f);
    }(function () {
        var __meta__ = {
            id: 'menu',
            name: 'Menu',
            category: 'web',
            description: 'The Menu widget displays hierarchical data as a multi-level menu.',
            depends: ['popup']
        };
        (function ($, undefined) {
     
        ...
     
     
        })(window.kendo.jQuery);
     
     
     
    })();
     
    return window.kendo;
     
    }, typeof define == 'function' && define.amd ? define : function(_, f){ f(); });

    This no more works with webpack latest version which returns

     

    ERROR in ../js/vendor/kendo/kendo.menu.js
    Module not found: Error: Cannot resolve module 'kendo.popup' in C:\<project>\js\vendor\kendo
     @ ../js/vendor/kendo/kendo.menu.js 26:4-44

     

  2. Jack
    Jack avatar
    100 posts
    Member since:
    Jan 2007

    Posted 16 Jan Link to this post

    See also https://github.com/webpack/webpack/issues/1897

    Note in the post above, the 2016.1.112 UMD wrapper actually is (see copy paste issue on last line):

    (function (f, define) {
        define('kendo.menu', ['kendo.popup'], f);
    }(function () {
        var __meta__ = {
            id: 'menu',
            name: 'Menu',
            category: 'web',
            description: 'The Menu widget displays hierarchical data as a multi-level menu.',
            depends: ['popup']
        };
        (function ($, undefined) {
      
        ...
      
      
        })(window.kendo.jQuery);
      
      
      
    })();
      
    return window.kendo;
      
    }, typeof define == 'function' && define.amd ? define : function (a1, a2, a3) {
        (a3 || a2)();
    }));



     

  3. Kendo UI is VS 2017 Ready
  4. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 18 Jan Link to this post

    Hello,

    the problem is already fixed, we will publish an internal build which addresses is. A webpack example is in the works, we will publish it shortly. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Mike
    Mike avatar
    18 posts
    Member since:
    Dec 2015

    Posted 12 Mar in reply to Petyo Link to this post

    Can we get an update on this problem, please?

    Is there somewhere that we can download this "internal build" that has, apparently, already fixed the problem?

  6. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 14 Mar Link to this post

    Hi,

    the problem is addressed in our SP1 release - 226. Check the following help article, too.

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Mike
    Mike avatar
    18 posts
    Member since:
    Dec 2015

    Posted 14 Mar in reply to Petyo Link to this post

    The method used in that help article, i.e. setting resolve.root in the webpack config file, didn't work for me.  

    What does work for me, as I posted on the github bug report linked above, was to added an extra entry to my resolve.moduleEntries in the webpack config file.

     

    I'm installing Kendo Pro from Bower, as per Telerik instructions, so my paths are different.  I've setup a github repository showing my continuing problems at https://github.com/brownieboy/kendo-webpack-error-2016.1.226-SP1.  Can somebody please take a look and tell me what I'm doing wrong, in anything?  I can log a separate bug report, if required.

     

     

     

     

    https://github.com/brownieboy/kendo-webpack-error-2016.1.226-SP1

     

     

  8. Ryan
    Ryan avatar
    1 posts
    Member since:
    Mar 2016

    Posted 15 Mar in reply to Petyo Link to this post

    Are there any steps for how to do this with Trial versions?  I am currently evaluating Kendo with an already established Webpack build.  As it is a trial, I do not have access to the source files, which makes management with Webpack slightly more difficult, since it attempts to import the angular and jquery packaged with Kendo, but cannot find them.
  9. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 16 Mar Link to this post

    Hi,

    @Mike, as far as I saw, you are using prefixes at both the bower mapping AND in the module name, which most likely results in duplicate paths. 

    @Ryan the webpack approach should work just as expected with the files available in the trial bundle, too. In fact, our examples show how to load kendo.all.min.js. I am afraid that I am not sure what you mean the anguar/jquery parts - at any case, we have examples for that in the documentation, too.

    In several other threads we have received numerous affirmative responses that the webpack/requirejs/systemjs configuration posted works as expected with the SP1 release. To avoid further confusion and potential misunderstanding that this problem is unresolved, I will close this thread.

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