1. #1
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default SenchaCmd 3.0.0.190 issues with Ext.Loader

    SenchaCmd 3.0.0.190 issues with Ext.Loader


    I have a Sencha Architect 2.1 (SA21) project that I am trying to compile with SenchaCmd.
    The structure of the project is as following:
    Code:
    /app
    /lib
        /extjs
        /ux
    /build
        /index.html
        /myapp-all-debug-w-comments.js
        /myapp-all-debug.js
        /myapp-all.js
    /bootstrap.js
    /app.js
    /app.html
    /index.html

    Project loads fine with both app.html and index.html.
    index.html uses ext-dev.js and has all the necessary directives for compiling (as app.html is reserved by SA21). See below for index.html


    The problem is 2 fold.


    Problem #1
    ---------------------------
    1) When I generate bootrstrap.js and use it in index.html I get bunch of loading errors. If I comment out bootstrap.js, everything works ok. Here is the command I use to generate bootrstap.js
    Code:
    sencha compile -classpath=lib/extjs/src,lib/ux,app,app.js ^
        meta -loader-paths -base-path . -out bootstrap.js and ^
        meta -alternates -append -out bootstrap.js and ^
        meta -alias -append -out bootstrap.js and ^
        meta -manifest -out manifest.json and ^
        meta -filenames -json -out filenames.json
    Th errors I get are a bunch of Ext.Loader issues with following format:
    Code:
    Uncaught Error: [Ext.Loader] Failed loading 'app/controller/MyAppControllerOne.js/model/account/Index.js', please verify that the file exists 
    Uncaught Error: [Ext.Loader] Failed loading 'app/controller/MyAppControllerOne.js/view/account/Index.js', please verify that the file exists
    Notice the path!? It does not make sense and I am not sure where it is getting this path.
    The bootstrap.js file that is generated has correct paths (among many) for all files reported in the error console.
    It looks proper to me:
    Code:
    Ext.Loader.addClassPathMappings({
    ...
    "MyApp.controller.MyAppControllerOne": "app/controller/MyAppControllerOne.js",
    ...
    "MyApp.model.account.Index": "app/model/account/Index.js",
    ...
    "MyApp.view.account.Index": "app/view/account/Index.js",
    Any idea what I am doing wrong here?


    Problem #2
    ---------------------------
    2) After compiling the app and using "all-in-one" generated JS file, I am still getting loader errors. I use following command to generate build files
    Code:
    sencha compile -classpath=lib/extjs/src,lib/ux,app,app.js -ignore=./bootstrap.js ^
        concat build/myapp-all-debug-w-comments.js and ^
        -options debug:true concat -strip-comments build/myap-all-debug.js and ^
        -options debug:false concat -yui build/myap-all.js

    The problem is again related to loader. The fact is, loader is supposed to be disabled here (documentation specifies that Ext.Loader is disabled by default)! But according to messages, it is not.
    I breifly modified -debug file and added
    Code:
    Ext.Loader.setConfig({
        enabled: false
    });
    but some files still fail to load.
    What I don't understand is why these files are being even looked by by loader when all classes and now in single file.I included "production" index.html that I used












    /index.html
    Code:
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>MyApp</title>    
            <link rel="stylesheet" type="text/css" href="lib/extjs/resources/css/ext-all.css" />
            <link rel="stylesheet" type="text/css" href="resources/css/app.css" />        
            <!-- <x-compile> -->
                <!-- <x-bootstrap> -->
                <script type="text/javascript" src="lib/extjs/ext-dev.js"></script>
                <script type="text/javascript" src="bootstrap.js"></script>
                <!-- </x-bootstrap> -->
                <script type="text/javascript" src="app.js"></script>
            <!-- </x-compile> -->                 
        </head>
        <body>
            <div id="loading-mask"></div>
            <div id="loading">
                <div class="loading-indicator">
                    Loading...
                </div>
            </div>
        </body>
    </html>



    /build/index.html
    Code:
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>MyApp</title>    
            <link rel="stylesheet" type="text/css" href="../lib/extjs/resources/css/ext-all.css" />
            <link rel="stylesheet" type="text/css" href="../resources/css/app.css" />        
    <script type="text/javascript" src="myapp-all-debug.js"></script>
        </head>
        <body>
            <div id="loading-mask"></div>
            <div id="loading">
                <div class="loading-indicator">
                    Loading...
                </div>
            </div>
        </body>
    </html>

  2. #2
    Sencha User
    Join Date
    Oct 2010
    Posts
    75
    Vote Rating
    4
    devnullable is on a distinguished road

      0  

    Default


    Hi!

    I have been trying to get some attention from Sencha side but no success so far...

    Anyway you can find temporary fix for the bug:

    http://www.sencha.com/forum/showthre...l=1#post897523

  3. #3
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default


    The issue you describe in your linked thread is exactly what I am experiencing as well, but your proposed fix (commenting out if statement block on line 392 of ./src/core/src/class/Loader.js) did not work for me... BTW, I am using ext js 4.1.2a

  4. #4
    Sencha User
    Join Date
    Oct 2010
    Posts
    75
    Vote Rating
    4
    devnullable is on a distinguished road

      0  

    Default


    Hi!

    In case of your problem #1 you should comment it out in lib/extjs/ext-dev.js because that is the file that default index.html is using.

  5. #5
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default


    I did that too, and am still getting errors.
    [Ext.Loader] Failed loading 'Ext/app/Application.js'

  6. #6
    Sencha User
    Join Date
    Oct 2010
    Posts
    75
    Vote Rating
    4
    devnullable is on a distinguished road

      0  

    Default


    I don't use Sencha Architect so I cannot help with that. Instead I have generate app with command sencha app generate which makes little bit different directory structure.

    How about if you use command sencha app refresh? That should update the bootstrap.js file.

    This Sencha Cmd 3 is more or less a moving target so it is not easy to keep yourself up to date

  7. #7
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default


    Refreshing bootstrap.js didn't solve the issue either.
    What I don't understand is why the Loader is throwing these errors even for production, "all in one" file. I even explicitly disabled the dynamic loading and am still getting weird errors...

    Its frustrating ...

  8. #8
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default


    Can anyone from Sencha team comment on this please?

  9. #9
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Location
    Kansas
    Posts
    1,511
    Vote Rating
    176
    dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of dongryphon has much to be proud of

      0  

    Default


    I apologize for not replying sooner.

    Let's start with the bootstrap problem. This looks familiar and maybe because of a code review for fixing it. We are going to refresh the Cmd build very soon but could you try 3.0.0.201 mentioned here:

    http://www.sencha.com/forum/announcement.php?f=91&a=36

    Just to see if that helps. If not I will do some further digging.

    On problem 2, can you include the errors you are seeing? Or are they the same ones?

    On the compile command you are using... it will produce all of the framework, ux library and your app. I suspect you are after the part of the framework and ux library that you are actually using. To do that, try something like this:

    Code:
      sencha compile -classpath=app.js,app,lib/extjs/src,lib/ux ^
          union -recursive -file app.js and ^
          concat build/myapp-all-debug-w-comments.js and ^
          -options debug:true concat -strip-comments build/myap-all-debug.js and ^
          -options debug:false concat -yui build/myap-all.js
    You don't need to ignore the bootstrap.js file since it is not in your classpath. The union command clears the current set and unions in the specified things. In this case, just "app.js". Then the -recursive option kicks in and does the transitive dependency inclusion to pick up whatever is needed by something in the current set (just "app.js").

    See http://docs.sencha.com/ext-js/4-1/#!...mmand_compiler for more on union.

    On "sencha app refresh" that will only work in an application generated by Sencha Cmd - but we are working to get this and Sencha Architect aligned.
    Don Griffin
    Engineering Manager - Frameworks (Ext JS / Sencha Touch)

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  10. #10
    Touch Premium Member
    Join Date
    Aug 2011
    Posts
    96
    Vote Rating
    6
    abcoa is on a distinguished road

      0  

    Default


    Don

    Thanks for replying.
    I tried v3.0.0.201 and both problems still persist.
    Since the linked thread (see above) mentioned that this could be issue related to Ext JS itself, I filed support ticket (9751) which resulted in Jira issue SDKTOOLS-217. Not sure if that helps but I thought I should mention it.

    Problem 1
    I rebuilt the meta before opening index.html. The generated bootrstap.js has Ext.Loader.addClassPathMappings that, visually at least, contain correct relative paths to all app files.
    However as soon as I navigate to index.html, the Loader starts complaining that it cannot find views,models, and controllers.... As soon as I comment out bootstrap.js line everything goes back to normal.

    Problem 2
    There are no error messages during compile, but when I try to use build/index.html with all-classes.js (generated using compile page) or with myapp-all-debug.js (generated using snippet you posted), I get the same Ext.Loader errors as in Problem 1.
    BTW, the command that I used in original post and the one you specified (with recursion) produce myapp-all-debug.js and myapp-all.js that exact same size! There appears to be no diiference

    One more thing...Ext.Loader (according to docs) is supposed to be disabled by default. However, when I run "all.js" files it is still enabled. Since there is no way in Architect to set enabled:false, I tried manually editing produced -debug.js file for my app and setting enabled to false. The end result is still the same - the app fails to load due to missing files (which is weird because they are included in -all-*.js files)....The error looks something like this

    Ext.Loader is not enabled, so dependencies cannot be resolved dynamically. Missing required classes: MyApp.model.account.Index, MyApp.store.account.Index, MyApp.store.lookup.LedgerPeriod