4

Sencha Touch 2.2.1
コマンド 3.1.342

Sencha チャートとカルーセルを使用してデータを表示するために使用する sencha Web アプリがあります。データはajax経由で取得されます。コンポーネントは、サーバーから受信したデータの量に応じて作成されます。

開発中はすべて正常に動作します。ただし、製品ビルドを作成すると、コンポーネントは作成されますが、カルーセルが取り込まれず、アプリがクラッシュします。これは、次を使用してカルーセルをコンテナーに追加しようとすると発生するようです。Ext.getCmp(siteNamex+'Cont').add(thecarousel);

その後、死亡し、コンソールログには次のように表示されます。

Uncaught TypeError: 未定義の Ext.ClassManager.parseNamespace
Ext.ClassManager.get
Ext.ClassManager.instantiate
Ext.ClassManager.instantiateByAlias
Ext.apply.factory
Ext.define.factoryItem
Ext.define.add Ext.Ajax. request.success
Ext.apply.callback
Ext.define.onComplete
Ext.define.onStateChange (無名関数)

コンテナを作成するコードは次のとおりです。

newcontainer = Ext.Container({
        xtype : 'container',
        flex: 1,
        margin: '0',
        id: siteNamex+'Cont',
        itemId: siteNamex+'Cont',
        height: '100%',
        items: [], 
        cls:'siteContainer',
        html: '<h2 class="siteName" style="'+snStyle+'">'+siteName+'</h2>'
     });

このコードは機能しているようで、必要に応じてコンテナーを作成します。

チャートは配列にデータを取り込みます。サイズは、ajax 経由で受信したデータによって異なります。

var allcharts = new Array(); //initializing

ゲージ チャートの作成:

chartgx = Ext.chart.Chart({  
        xtype: 'chart',  
        renderTo: Ext.getBody(),  
        cls: 'thegauge',  
        itemId: 'gauge'+tt2,  
        store: gaugeStore,  
        width : 'auto',  
        background: 'white',  
        animate: true,  
        insetPadding: 50,  
        axes: [{  
              type: 'gauge',  
              position: 'gauge',  
              minimum: 0,  
              maximum: gaugemax,  
              steps: 10,  
          margin: 10  
            }],  
            series: [{  
              type: 'gauge',  
              field: 'CurrentValue',   
              donut: 30,  
              colorSet: ['#f6821f;', '#e0e2e4']  
            }]  
        });

次に、このゲージをコンテナーに入れ、配列に追加します。

chartgx2 = Ext.Container({  
        xtype : 'container',  
        flex: 1,  
        layout: 'fit',  
        cls: 'gaugeContainer',  
        items: chartgx,   
        html: gaugeText  
           })  
allcharts.push(chartgx2);

カルーセルは、次を使用して作成されます。

thecarousel = Ext.Carousel({
                        xtype: 'carousel',
                        width: '100%',
                        height: '100%',
                        itemId: 'thecarousel_'+siteName,
                        cls: 'chartscarousel',
                        id: siteNamex+'_carousel',
                        defaults: {
                            styleHtmlContent:true
                        },
                        items: allcharts
                    })

を使用してコンテナに追加されますExt.getCmp(siteNamex+'Cont').add(thecarousel);

先に述べたように、これはすべて開発では問題なく機能しますが、本番ビルドでは前述のエラーがスローされます。

私のapp.jsには次のものがあります:

requires: [
        'Ext.field.Select',
    'Ext.Ajax',
    'Ext.Button',
    'Ext.carousel.Indicator',
    'Ext.carousel.Infinite',
    'Ext.carousel.Item',
    'Ext.carousel.Carousel',
    'Ext.fx.easing.EaseOut',
    'Ext.util.TranslatableGroup',
    'Ext.chart.Chart',
    'Ext.chart.axis.Gauge',
    'Ext.chart.theme.*',
    'Ext.util.Format',
    'Ext.MessageBox',
    'Ext.form.Panel',
    'Ext.Panel',
    'Ext.fx.Parser',
    'Ext.Container',
    'Ext.data.*',
    'Ext.dataview.List',
    'Ext.dataview.component.Container',
    'Ext.chart.theme.Base',
    'Ext.chart.theme.TitleStyle',
    'Ext.chart.theme.GridStyle',
    'Ext.chart.Toolbar',
    'Ext.chart.legend.View',
    'Ext.chart.Legend',
    'Ext.chart.series.Bar',
    'Ext.chart.series.Column',
    'Ext.chart.series.Gauge',
    'Ext.chart.series.Series',
    'Ext.chart.axis.Numeric',
    'Ext.chart.axis.Category',
    'Ext.draw.Surface',
    'Ext.draw.Draw',
    'Ext.draw.Matrix',
    'Ext.draw.engine.Canvas',
    'Ext.draw.CompositeSprite',
    'Ext.fx.Frame',
    'Ext.draw.Sprite',
    'Ext.fx.Sprite',
    'Ext.Component',
    'Ext.ComponentManager',
    'Ext.ComponentQuery',
    'Ext.TitleBar',
    'Ext.draw.sprite.Sector',
    'Ext.draw.sprite.Rect',
    'Ext.chart.interactions.Abstract',
    'Ext.chart.axis.Axis',
    'Ext.util.SizeMonitor',
    'Ext.chart.grid.HorizontalGrid',
    'Ext.chart.grid.VerticalGrid'
    ],

build コマンドを実行してもエラーはありません。Sencha Touch 2.2.1
コマンド 3.1.342

更新:このコードを使用して、ページに表示されているとおりに ゲージを再構築しました。これで問題は解決しませんでした

4

1 に答える 1

5

次のようにデバッグします。

  1. アプリを Chrome で開く
  2. 開発ツールを開く
  3. 「ソース」タブに移動します
  4. 一時停止記号 (「キャッチされない例外で一時停止」、下の画像の左下の矢印) を 2 回クリックします。
  5. アプリケーションがクラッシュすることを実行するか、ロード時にクラッシュする場合はリロードします
  6. デバッガーは、メモした例外をスローする直前に起動します
  7. 呼び出しスタックで、行を選択しますExt.ClassManager.instantiateByAlias(2 番目の矢印)
  8. [Scope Variables] タブに、犯人の名前が表示されます (以下の丸で囲んだ部分)。

変数名は、縮小プロセスのために異なる場合がありますが、簡単に識別できるはずです。必要に応じて、ファイルの圧縮を無効にし.sencha/app/production.propertiesて実際のコードを表示し、簡単にすることができます。

Chrome のデバッグ

于 2013-09-26T13:11:00.350 に答える