CODEWITHSUNDEEP
javascriptextjsextjs6extjs6-classic
jaumard
jaumard

Reputation: 8292

ExtJS 6 configure Ext.ux

I'm trying to use the color picker under ext/packages/ux/classic/src/colorpicker So I set my requires : 

requires: [
        'Ext.plugin.Viewport',
        'Ext.window.MessageBox',


        'ThemeDemoApp.view.main.MainController',
        'ThemeDemoApp.view.main.MainModel',
        'ThemeDemoApp.view.main.List',
        'Ext.slider.Single',
        'Ext.ux.colorpick.Button'
    ]

And at the top of app.js, I set this : 

Ext.Loader.setConfig({                enabled : true,
                paths   : {
                        'Ext.ux' : 'ext/packages/ux/classic/src'
                } 
        });

But it's not working I have : Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:1841/ext/classic/cl...=1437726506841

It doesn't take my loader configuration. How can I configure Ext.ux correctly ?

Thanks

Upvotes: 8

Views: 6130

Answers (3)

pkrav
pkrav

Reputation: 1

With EXT Js, using Sencha CMD, adding requires [...,"ux"] is sufficient.

Upvotes: 0

Greendrake
Greendrake

Reputation: 3734

Make sure that your app.json requires ux:

"requires": [
    // ...
    "ux"
]

Also, as you are using Sencha CMD there is no need to worry about Ext.Loader.

Upvotes: 11

Paweł Głowacz
Paweł Głowacz

Reputation: 3046

This is how i configured my web application that uses Ext.ux. Take a look: enter image description here

As you can see i added ext-ux folder with all interested for me sources inside webapp. In app.js i added:

Ext.Loader.setPath('Ext.ux', 'extjs/ext-ux/src/ux');

In index.jsp i added: 

<head>
    <script type="text/javascript" src="extjs/ext-all-debug.js"></script>
    <script type="text/javascript" src="extjs/ext-ux/ext-ux-debug.js"></script>
    <script type="text/javascript" src="app.js"></script>
</head>

Of course paths will change depends on your configuration.

And example to show how to use it:

Ext.define('ScuWeb.ScuWebApp', {
    extend: 'Ext.ux.desktop.App',

    requires: [
        'Ext.window.MessageBox',
        'Ext.ux.desktop.ShortcutModel'
    ],

Upvotes: 1

Related Questions