Custom ES6 controller: cannot use import statement outside a module

[bandtank]

I created files according to this page. The following works as expected:

define('calendar2:controllers/calendar2', ['controllers/record'], function (Dep) {
  return Dep.extend({
      actionHello: function (options) {
          console.log('action: hello');
      },
  });
});

Console:

action: hello

However, this does not work:

import Controller from 'controllers/record';

class Calendar2Controller extends Controller {
  actionHello(options) {
    console.log("action: hello")
  }
}

export default Calendar2Controller;
​

Console:


The source in the developer window shows an anonymous function, which is not in my file:



How is this supposed to work?

[bandtank]

This issue is also being tracked in Github.

[bandtank]

This has been figured out. Please see the issue on Github in my previous post for more details.

[flanklin]

This has been figured out. Please see the issue on Github in my previous post for more details.

Hi bandtank can you give that issue link? I have done but not found.

[yuri]

You can use ES6 modules only from within an Espo module, it's not supported for custom folder customizations.

When you run init from the ext-template repository, the script will ask whether you want to use ES6, but it will only work for new extensions you develop.

[telecastg]

One alternative is not to use ES6 modules and continue using AMD modules as before.

Per yuri , the AMD syntaxis will continue to be supported "maybe forever" and curently the ES6 modules are actually transpiled back to AMD modules for execution.

The main advantage of using ES6 modules, for those that care about it, is the support from IDE applications like PhpStorm.