Safari上的Polymer 2.0

Question

有人可以幫我一個疑問嗎？我正在Safari上測試新的Polymer 2.0預覽版，但似乎無法正常工作。 事實是，我在index.htm中使用了一個簡單的代碼（僅是my-element），加載了polyfill，但我卻沒有構建並使用gulp和BrowserSync進行處理。 碰巧的是，它可以在Chrome和Mozila上運行，但不能在Safari上運行。 該組件甚至不加載。

在Safari上投放之前，我需要構建嗎？

它只是一個簡單的代碼，僅用於測試...但無論如何我都會發布：

指數：

<!DOCTYPE html>
<html lang="pt-br">
<head>

  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>Polymer element - Test</title>

  <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>    

  <link rel="import" href="/src/my-element.html"></link>    

</head>   

<body>

  <my-element></my-element>

</body>
<script>
  window.addEventListener('WebComponentsReady', function() {
    alert('Web Components Working');
  });
</script>
</html>

我的元素：

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

<dom-module id="my-element">
  <template>

    <!-- Style -->
    <style>

      :host {
        display: block;
      }

    </style>
    <h2>Name : [[name]]</h2>

    <slot></slot>

  </template>

  <script>

    // Extend Polymer.Element base class
    class MyElement extends Polymer.Element {

      static get is(){ return 'my-element' }

      // properties
      static get properties() {
        return {
          name: {
            type: String,
            value: 'my-element'
          }
        };
      }

      // observers
      static get observers() {
        return ['_nameChanged(name)'];
      }

      // constructor
      constructor() {
        super();
        console.log('my-element > created');
      }

      connectedCallback(){
        super.connectedCallback();
        console.log('my-element > attached');

      }

      disconnectedCallback(){

      }

      attributeChangeCallback(){

      }

      // ready > add listeners and attributes at appropriate callback
      ready() {
        this.addEventListener('click', (e) => {
          this._handleClick(e);
        });

        super.ready();
        console.log('my-element > ready');
      }

      _handleClick(e) {
        console.log(e.type);
      }

      _nameChanged(name){
        console.log(`Name: ${name}`);

        // Select the elements
        // this.$.
        // this.$.
      }


    }

    // Register custom element definition using standard platform API
    customElements.define(MyElement.is, MyElement);
  </script>
</dom-module>

Answer 1

嘗試更改上面的導入：

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

至：

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

看看是否可行。

您可以檢查目錄並在以下目錄中查找文件“ polymer-element.html”：

../bower_components/polymer/

Safari上的Polymer 2.0

問題描述

1 個解決方案

解決方案1
1 2017-03-09 02:55:48

Safari上的Polymer 2.0

問題描述

1 個解決方案

解決方案1 1 2017-03-09 02:55:48

解決方案1
1 2017-03-09 02:55:48