How to use polymer 2 with babel

I run my-widget.jsthrough babel (es2015 preset) to create my-widget-es5.js. This causes an error in Polymer.

Class constructor PolymerElement cannot be invoked without 'new'
    at new MyWidget (my-widget.js:##)
    at mw-widget.js [sm]:##

file structure

out
 |
 -- my-widget-es5.js
js
 |
 -- my-widget.js
html
 |
 -- my-widget.html

my-widget.html

<dom-module id="my-widget">
    <template>
        <script src="/out/my-widget-es5.js"></script>
    </template>
</dom-module>

my-widget.js

class MyWidget extends Polymer.Element {
    static get is() {
        return 'my-widget';
    }
}

customElements.define(MyWidget.is, MyWidget);
+4
source share
2 answers

According to SO user @joncarlson:

You can find a solution using the file custom-elements-es5-adapter.jssuggested as a Webcomponentsjs workaround .

+3
source

Take a look at the link below. Just use the preinstalled version in es5 and you should be ready to go. It will include the conditional load custom-elements-es5-adapter.json mentioned by @Supersharp.

https://www.polymer-project.org/2.0/docs/tools/polymer-json#builds

0

Source: https://habr.com/ru/post/1672504/


All Articles