Publishing ext.js 7.2 Modern project with localization

Question

I've build a small sample app with Ext JS 7.2 Modern, which only contains of a panel with a button. In the click-handler of the button, a dialog is created and shown with two buttons "ok" and "cancel":

    Ext.define('EmpDir.view.MyPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.mypanel',

    requires: [
        'EmpDir.view.MyPanelViewModel',
        'Ext.Button'
    ],

    viewModel: {
        type: 'mypanel'
    },
    title: 'My Panel',

    items: [
        {
            xtype: 'button',
            handler: function(button, e) {
                var dialog = Ext.create('Ext.Dialog', {
                    title: 'Dialog',
                    closable: true,
                    defaultFocus: '#ok',
                    maximizable: true,
                    bodyPadding: 30,
                    maxWidth: 300,
                    html: 'This is a dialog, which extends from Panel and adds some extra features.',
                    buttons: {
                        ok: {
                            handler: function() {
                                // Do something
                                this.up('dialog').hide();
                            }
                        },
                        cancel: {
                            handler: function() {
                                // Do something
                                this.up('dialog').hide();
                            }
                        }
                    }
                });

                dialog.show();
            },
            text: 'MyButton2'
        }
    ]
});

If I then publish the project (not build, but publishing, making a release version to ship to the customer so to say), the text of the two buttons are 'Ok' and 'Cancel', because of the default "en" localization.

Now I want to localize the two buttons, for example, in German. The expected outcome should be 'Ok' and 'Abbrechen'.

So I followed the guides from the Sencha docs here and here.

The first thing I've tried was inserting the following code in app.json.

"requires": [
      "ext-locale"
],
"locale": "de",

But that did nothing. The text of the buttons was still in English.

Then I've tried the other suggestion

   "requires": [
      "ext-locale"
   ],
   "locales": [
      "de",
      "fr"
   ],

Again, it didn't work.

The fist times I've used Sencha Architect for publishing so I thought, maybe it works with Sencha cmd.

But no, it didn't. It always stays English. I checked the publish folder and couldn't find any locale-xx.js files in there.

However, when I'm previewing the project it works every time.

How can we reproduce the bug? – Arthur Rubens Aug 28 '20 at 15:22 — Arthur Rubens, Aug 28 '20 at 15:22
I have edited the post for more clarification – Olli Peh Aug 29 '20 at 16:19 — Olli Peh, Aug 29 '20 at 16:19

score 0 · Accepted Answer · answered Sep 08 '20 at 19:27

So after all it was a bug. With help from the support I had to comment the last part of the ext-locale-de.js file, which can be found here: ext\modern\locale\overrides\de

/* Ext.define("Ext.locale.de.grid.filters.menu.Base", {
    override: "Ext.grid.filters.menu.Base",

    config: {
        text: "Filter"
    }
});

Ext.define('Ext.locale.de.grid.locked.Grid', {
    override: 'Ext.grid.locked.Grid',

    config: {
        columnMenu: {
            items: {
                region: {
                    text: 'Region'
                }
            }
        },
        regions: {
            left: {
                menuLabel: 'Verschlossen (Links)'
            },
            center: {
                menuLabel: 'Freigeschaltet'
            },
            right: {
                menuLabel: 'Verschlossen (Recht)'
            }
        }
    }
});

Ext.define("Ext.locale.de.grid.plugin.RowDragDrop", {
    override: "Ext.grid.plugin.RowDragDrop",
    dragText: "{0} Zeile(n) ausgewählt"
});
 */

Publishing ext.js 7.2 Modern project with localization

1 Answers1

Linked