2017-04-17 5 views
0

Ich experimentiere mit Polymer-2/webcomponents und schließe erfolgreich this Tutorial. Außerdem habe ich eine Testdatei hinzugefügt, die & Anzeigen in Chrome lädt (ohne richtige Verschachtelung), aber in Safari (10.0.3) und Firefox (52.02) überhaupt nicht angezeigt wird, sehe ich eine Reference error: can't find variable Polymer alle Abhängigkeiten scheinen verfügbar zu sein unter bower_components und wenn ich Polymer in FF und Safari-Konsole eingeben, scheint Polymer definiert zu werden, also könnte es ein Timing-Problem sein? Was kann mehr falsch sein?Warum erkennt Safari/Firefox das Polymer nicht?

<!doctype html> 
<html lang="en"> 
<head> 
    <script> 
    window.ShadyDOM = { force: true }; 
    </script> 
    <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script> 
    <link rel="import" href="bower_components/polymer/polymer.html"> 
</head> 
<body> 
    <dom-module id="my-foo"> 
    <template> 
     <h1> 
     <slot></slot> 
     </h1> 
    </template> 
    <script> 
     Polymer({ is: 'my-foo' }); 
    </script> 
    </dom-module> 
    <dom-module id="my-bar"> 
    <template> 
     <i> 
     <slot></slot> 
     </i> 
    </template> 
    <script> 
     Polymer({ is: 'my-bar' }); 
    </script> 
    </dom-module> 
    <my-foo> 
    <my-bar>Hello world!</my-bar> 
    </my-foo> 
</body> 
</html> 

Antwort

0

Versuchen hinzuzufügen:

<!-- Load webcomponents-loader.js to check and load any polyfills your browser needs --> 
    <script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script> 
+0

Danke für Sie beantworten, aber jetzt bekomme ich eine Menge Fehler wie 'Ein benutzerdefiniertes Element mit dem Namen Dom-wenn | Bind | Modul | Selektor 'bereits definiert wurde' –

0

Es funktioniert gut, wenn Sie die Dokumentvorlagen in einer separaten Datei und link rel=import href.. zu dieser Datei bewegen.

Verwandte Themen