Ist es möglich, Module in eine Polymerkomponente zu importieren?

Question

Ich möchte meine Polymer-Komponenten schön gekapselt halten, aber gerade jetzt, wenn ich versuche, irgendwelche externen Module in die Komponenten zu importieren, bekomme ich einen undefinierten Fehler für "Import".

Ich benutze Webpack, um meine App zu bündeln, aber das packt nur meine Javascript-Dateien.

Gibt es eine Möglichkeit, meine Polymer-Komponente in einer einzigen HTML-Datei gekapselt zu halten oder muss ich den js-Teil trennen, wenn es um Importe geht?

Beispiel:

<link rel="import" href="../bower_components/polymer/polymer.html"> 

<dom-module id="my-new-view"> 
    <template> 
    <style> 
    </style> 

    <h1>New view</h1> 
    </template> 

    <script> 

    import { myConstant } from '../module.js'; //<---- this throws error for the import' 

    Polymer({ 
     is: 'my-new-view' 
    }); 
    </script> 
</dom-module> 

Answer 1

Nur Webpack

Denn es, so zu arbeiten, würden Sie haben module.js als Bibliothek zu exportieren, so dass es außerhalb von Webpack verwendet werden. Wenn es Teil einer Bibliothek und enthielt im globalen Bereich ist können Sie dann darauf zugreifen wie

var myConstant = Module.myConstant; 

Polymer({ 
    is: 'my-new-view' 
}); 

Es ist wahrscheinlich viel einfacher, nur Ihren JS-Code in einer separaten Datei.

Siehe https://stackoverflow.com/a/34361312/4722305.

Crisper

Eine andere Option könnte sein, https://github.com/PolymerLabs/crisper über Ihren Code auszuführen, bevor sie in webpack aufrufen. Crisper entfernt die <script> Tags aus Ihrem Code und konvertiert sie in JS Dateien, die mit Webpack kompatibel sind.