ExtJs 6 - 簡單應用程序 - Ext.Loader 無法加載

Question

我想使用一個名為Ext.ux.form.ItemSelector的ExtJs 6 組件。

為了測試它的最小功能，我決定創建一個簡單的index.html和app.js文件並在我的瀏覽器中運行它是合適的。

但是我的瀏覽器控制台出現錯誤：
[E] [Ext.Loader] Some requested files failed to load. ext-all-debug.js:8735:21

這是我的index.html文件：

<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>ItemSelectorThemeSwitchTester</title>


     <script type="text/javascript" src="some/path/ext/6.x/ext-all-debug.js"></script>
     <script type="text/javascript" src="some/path/ext/6.x/packages/ux/classic/ux-debug.js"></script>

    <link rel="stylesheet" type="text/css" href=some/path/ext/6.x/classic/theme-triton/resources/theme-triton-all.css">
    <link rel="stylesheet" type="text/css" href="some/path/ext/6.x/classic/theme-triton/resources/theme-triton-all_1.css">
    <link rel="stylesheet" type="text/css" href="some/path/ext/6.x/classic/theme-triton/resources/theme-triton-all_2.css">


    <script type="text/javascript" src="some/path/ext/6.x/packages/charts/classic/charts.js"></script>
    <script type="text/javascript" src="some/path/ext/6.x/classic/theme-triton/theme-triton.js"></script>
    <script type="text/javascript" src="some/path/ext/6.x/classic/locale/locale-de.js"></script>

    <script type="text/javascript" src="app.js"></script>
</head>

這是我的app.js文件：

Ext.application({
name: 'ItemSelectorThemeSwitchTester',
requires: ['Ext.ux.form.ItemSelector'],
launch: function() {

    var my_array_store = Ext.create('Ext.data.ArrayStore', {
        fields: ['some_value', 'some_text'],
        data: [
            ['1', 'a'],
            ['2', 'b'],
            ['3', 'c'],
            ['4', 'd'],
            ['5', 'e'],
            ['6', 'f'],
            ['7', 'g'],
            ['8', 'h'],
            ['9', 'i'],
            ['10', 'j'],
            ['11', 'k']
        ],
        autoLoad: true
    });

    var my_item_selector_instance = Ext.create("Ext.ux.form.ItemSelector", {
        anchor: '100%',
        fieldLabel: 'ItemSelector',
        imagePath: '../ux/images/',
        store: my_array_store,
        displayField: 'some_text',
        valueField: 'some_value',
        allowBlank: false,
        msgTarget: 'side',
        fromTitle: 'Set of relations',
        toTitle: 'Selected relations',
        scrollable: true,
        height:250
    });

    var my_form_panel = Ext.create("Ext.form.Panel", {
        title: 'ItemSelector Test',
        width: 700,
        bodyPadding: 10,
        height: 400,
        items: [my_item_selector_instance]
    });

    var vp = new Ext.Viewport({
        layout: 'fit',
        items: [my_form_panel],
        autoScroll: true,
        renderTo: Ext.getBody()
    });
}

});

我嘗試了不同的方法來解決這個錯誤。 我什至有一個正在運行的Sencha Fiddle Example 。

但我不知道為什么它會拋出這個錯誤？

編輯：

我添加了Ext.Loader.setPath('Ext.ux', 'C:/ext-6.0.0-gpl/ext-6.0.0/build/packages/ux/'); 到app.js文件的第一行。

但同樣的錯誤仍然存在。

編輯2：

在@Pawel Glowacz 的第二條評論之后，我做了以下事情：

進入 ExtJs 6 GPL Files 文件夾your\\extraction\\path\\ext-6.0.0\\packages\\ux\\classic\\src
將上述文件夾的內容復制到我的項目中到文件夾my\\project\\path\\libs\\ext\\ux\\\u003c/code>
粘貼Ext.Loader.setPath('Ext.ux', 'libs/ext/ux'); 進入app.js的第一行

結果：

不適用於 Internet Explorer 和 Chrome，僅適用於 Firefox。
在index.html中將ext-all-debug.js與ext-all.js交換，然后它在 Chrome 和 Firefox 中工作，但在 Internet Explorer 中無效。

有人知道為什么嗎？

Answer 1

運行“sencha package build”時，您需要將包指向它們將使用的 SDK。

所以在我的情況下：

'c:\Dev\MyApp\'  Is my root
'c:\Dev\MyApp\Ext' is where my Ext instance is located.
'c:\Dev\MyApp\packages\local\package1' is my package.

我需要運行（從我的 package1 文件夾中）

'sencha -sdk ../../../Ext package build'

現在包知道在哪里找到你的 EXT 組件

ExtJs 6 - 簡單應用程序 - Ext.Loader 無法加載

問題描述

編輯：

編輯2：

1 個解決方案

解決方案1
1 2016-10-10 08:18:51

ExtJs 6 - 簡單應用程序 - Ext.Loader 無法加載

問題描述

編輯：

編輯2：

1 個解決方案

解決方案1 1 2016-10-10 08:18:51

解決方案1
1 2016-10-10 08:18:51