如何回溯调试ext-all-debug.js返回的错误

Question

Ext.Loader.setConfig({enabled: true});
Ext.Loader.setPath('Ext.ux', '/ux');
Ext.require([
    'Ext.tip.QuickTipManager',
    'Ext.menu.*',
    'Ext.form.field.ComboBox',
    'Ext.layout.container.Table',
    'Ext.container.ButtonGroup',
    'Ext.form.FieldSet',
    'Ext.data.*',
    'Ext.form.*'
]);
Ext.onReady(function() {
    Ext.QuickTips.init(); //tips box


Ext.define('MyApp.view.MyContainer13', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.myroutegridpanel',

    width:  window.innerWidth,
    header: false,
    height: window.innerHeight,
    //renderTo: Ext.getBody(), //cannot put in everywhere, if not this panel will full screen, can't see other already
    layout: {
        align: 'stretch',
        type: 'hbox'
    },

            items: [
                {
                    xtype: 'container',
                    flex: 1,
                    //maxWidth: window.innerWidth/3,
                    items: [
                        {
                             //xtype: 'mygridpanelroutename'
                            xtype: 'myroutegridpanel1'

                        }
                    ]
                }
            ]


});

// THIS IS THE PART I ADD IN, THEN ERROR OCCUR, until below ,please check my remark

Ext.create('Ext.window.Window', {
    alias: 'widget.myroutegridpanel1',
    width: 400,
    height: 400,
    title: 'Example of Dynamic Grid',
    layout: 'fit',
    items: [
        {
            // All what you have to set! :)
            xtype: 'dynamicGrid',
            url: 'route/get-routefare.php'
        }
    ]
});

Ext.define('Ext.ux.grid.DynamicGrid', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.dynamicGrid',
    alternateClassName: 'Ext.grid.DynamicGrid',
    // URL used for request to the server. Required
    url: '',

    initComponent: function() {
        var me = this;

        if (me.url == '') {
            Ext.Error.raise('url parameter is empty! You have to set proper url to get data form server.');
        }
        else {
            Ext.applyIf(me, {
                columns: [],
                forceFit: true,
                store: Ext.create('Ext.data.Store', {
                    // Fields have to be set as empty array. Without this Ext will not create dynamic model.
                    fields: [],
                    // After loading data grid have to reconfigure columns with dynamic created columns
                    // in Ext.ux.data.reader.DynamicReader
                    listeners: {
                        'metachange': function(store, meta) {
                            me.reconfigure(store, meta.columns);
                        }
                    },
                    autoLoad: true,
                    remoteSort: false,
                    remoteFilter: false,
                    remoteGroup: false,
                    proxy: {
                        reader: 'dynamicReader',
                        type: 'rest',
                        url: me.url
                    }
                })
            });
        }

        me.callParent(arguments);
    }
});

Ext.apply(Ext.data.Types, {
    FLOATORSTRING: {
        convert: function(v, n) {
            v = Ext.isNumeric(v) ? Number(v) : v;
            return v;
        },
        sortType: function(v) {
            v = Ext.isNumeric(v) ? Number(v) : v;
            return v;
        },
        type: 'floatOrString'
    }
});

Ext.define('Ext.ux.data.reader.DynamicReader', {
    extend: 'Ext.data.reader.Json',
    alias: 'reader.dynamicReader',
    alternateClassName: 'Ext.data.reader.DynamicReader',

    readRecords: function(data) {
        if (data.length > 0) {
            var item = data[0];
            var fields = new Array();
            var columns = new Array();
            var p;

            for (p in item) {
                if (p && p != undefined) {
                    // floatOrString type is only an option
                    // You can make your own data type for more complex situations
                    // or set it just to 'string'
                    fields.push({name: p, type: 'floatOrString'});
                    columns.push({text: p, dataIndex: p});
                }
            }


            data.metaData = { fields: fields, columns: columns };
        }

        return this.callParent([data]);
    }
});
 // UNTIL HERE, THOSE CODE AFTER ADDED, then returned ERROR in the picture below

}); // on ready

你可以看到我已经添加代码的代码，然后发生错误，但是，我想学习如何追溯错误来自，遗憾的是，ext-all-debug.js只显示那些简单的错误评论，如何追踪错误来自哪里？

Answer 1

你可以做几件事

引用ext-dev.js代替。差异与两个文件之间的差异有关。 ext-debug.js文件包含一次上传的所有支持javascript。 ext-dev.js文件只包含核心文件，需要根据需要加载支持的文件。我们通过这种方式获得更多信息错误。在这种情况下，别名无法识别。

其次，使用Chrome工具并右键单击并选择Inspect Element。通过在开发人员工具区域右上角的暂停按钮上单击两次，可以在“源”选项卡中看到代码失败的实际行。它会变成紫色。下面的屏幕显示了我们现在如何看到未突出显示的代码行