2017-04-15 69 views
0

我有一個類似於聚合物商店應用程序的projet設置。爲了減少應用程序本身的thr代碼庫,我將孔主頁面佈局分割成單獨的元素項目。該項目具有加載其Dependencys懶惰7的元件LayoutPoylmer應用程序外殼和延遲加載

_pageLoaded: function (shouldResetLayout) { 
      this._ensureLazyLoaded(); 
... 
} 
_ensureLazyLoaded: function() { 
     if (!this.loadComplete) { 
     Polymer.RenderStatus.afterNextRender(this, function() { 
      this.importHref(this.resolveUrl('lazy-resources.html'), function() { 
         this.loadComplete = true; 
        }, null, true); 
     }); 
    } 
}, 

基本上相同的邏輯商店應用內〔實施例。 _pageLoaded是我的Shop-app的雙向數據綁定頁面屬性的觀察者。

在我的店裏,應用程序本身,我包括layout元素,像這樣:

<link rel="import" href="../bower_components/lc-app-layout/lc-app-layout.html"> 

<lc-app-layout categories="[[categories]]" page="[[page]]" category-name="{{categoryName}}"> 
     <iron-pages role="main" selected="[[page]]" attr-for-selected="name" selected-attribute="visible"> 
      <!-- home view --> 
      <shop-home name="home" categories="[[categories]]"></shop-home> 
      <!-- list view of items in a category --> 
      <shop-list name="list" route="[[subroute]]" offline="[[offline]]" query-Params="[[queryParams]]"></shop-list> 
      <!-- detail view of one item --> 
      <shop-detail name="detail" route="[[subroute]]" offline="[[offline]]"></shop-detail> 
     </iron-pages> 
    </lc-app-layout> 

而且還必須在應用程序本身,其裝載相同的方式,在layout有些慵懶ressources。

現在,當我想建立對一切,我需要的layout元素的lazy-resurces作爲一個片段添加到Polymer.json,使該分析儀會發現它的dependencys:

"fragments": [ 
"src/view/list/shop-list.html", 
"src/view/detail/shop-detail.html", 
"src/lazy-resources.html", 
"bower_components/lc-app-layout/lazy-resources.html" 

沒有,當我爲這個構建,頁面不會加載大部分時間。它顯示錯誤,如:

Cannot read property '_makeReady' of undefined 
Polymer is not a function 
Cannot read property 'isDescendant' of undefined 

當我扼殺網絡速度,機會是更高的東西會加載。所以我認爲在異步ImportHref或類似的東西有一些時間問題。或者我只是想使用這些碎片來告訴分析儀掃描我的layout元素的稀有資源?

我正在使用Polymer-CLI 0.18.0。 Runnig與polymer serve的應用程序確實按預期工作。

回答

1

通過將延遲加載從layout元素移至Shop-app的lazy-ressource解決了該問題。