Ключевые глобальные переменные полимера не определены. Почему?

У меня странный набор ошибок, когда я загружаю свое приложение 

polymer-micro.html:117 Uncaught TypeError: Cannot read property '_makeReady' of undefined
     (anonymous function) @ polymer-micro.html:117

Неопределенным в этом первом является Polymer.RenderStatus 

polymer.html:3417 Uncaught TypeError: Polymer.dom is not a function
     _findStyleHost @ polymer.html:3417
     _computeStyleProperties @ polymer.html:3461
     _applyCustomProperties @ polymer.html:3652
     fn @ polymer.html:3638

Очевидно, Полимер.дом должен быть функцией. почему бы и нет?

Uncaught TypeError: Cannot read property '_isEventBogus' of undefined
      _notifyListener @ polymer.html:2012
      (anonymous function) @ polymer.html:1534
      fire @ polymer.html:1277
      _notifyChange @ polymer.html:1372
      _notifyEffect @ polymer.html:1553
     _effectEffects @ polymer.html:1405
     _propertySetter @ polymer.html:1389
     setter @ polymer.html:1468q
     ueryHandler @ iron-media-query.html:116

Это медиа-запрос, который генерирует эту ошибку каждый раз, когда мы перемещаем ширину экрана через границу медиа-запроса. Неопределенной переменной в этом случае является Polymer.Bind

Если я поставлю точку останова в верхней части полимера.html (сразу после тега script) ошибки идут прочь, когда я затем отпустил его. Это почти означает, что обычно он работает, не давая полимер-мини.загрузка html.

Я работаю с chrome и тестами в index.html относительно того, следует ли загружать webcomponents-lite.js polyfill, означает, что он не загружается.

Я застрял на том, что делать с отладкой этой проблемы. Есть идеи?

3 2
polymer

3 ответа:

Получается, что позиционирование скрипта инициализации в индексе.html является причиной этих проблем. Я скопировал приложение Polymer Shop, которое помещает скрипт в нижней части корпуса. Приложение, созданное инструментом polymer-cli (с шаблоном app-drawer), помещает скрипт в заголовок перед импортом элемента my-app.

Я подозреваю, что причина, по которой приложение магазина не имеет проблем, заключается в том, что заголовок не делает никакой анимации. Я использую эффект смешивания фона в моем заголовок и это может быть причиной его неудачи.

В любом случае, перемещение скрипта, который включает инициализацию полимера в заголовок, решило проблему.

4

Добавление асинхронности к импорту решило эту проблему для меня. 

<link rel="import" href="/src/your-app.html" async>

Вместо 

<link rel="import" href="/src/your-app.html">
2

Я экспериментирую с предварительным просмотром 2.0 и имел аналогичный набор ошибок, пытаясь следовать за маршрутизацией Polycast Роба Додсона (#47, 48 ish). Это то, что сработало после многих часов попыток других решений: 

    **<script src="/bower_components/webcomponentsjs/webcomponents-lite.js">**
  // Setup Polymer options
  window.Polymer = {
    dom: 'shadow',
    lazyRegister: true
  };

  // Load webcomponentsjs polyfill if browser does not support native Web Components
  (function() {
    'use strict';

    var onload = function() {
      // For native Imports, manually fire WebComponentsReady so user code
      // can use the same code path for native and polyfill'd imports.
      if (!window.HTMLImports) {
        document.dispatchEvent(
          new CustomEvent('WebComponentsReady', {bubbles: true})
        );
      }
    };

    var webComponentsSupported = (
      'registerElement' in document
      && 'import' in document.createElement('link')
      && 'content' in document.createElement('template')
    );

    if (!webComponentsSupported) {
      **// var script = document.createElement('script');
      // script.async = true;
      // script.src = '/bower_components/webcomponentsjs/webcomponents-lite.min.js';
      // script.onload = onload;
      // document.head.appendChild(script);**
    } else {
      onload();
    }
  })();

  // Load pre-caching Service Worker
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', function() {
      navigator.serviceWorker.register('/service-worker.js');
    });
  }
</script>
0