2017-06-20 88 views
0

我想要獲得一個基本的聚合物元素在IE 11中工作,但是我收到了錯誤,看起來像是由於聚合物代碼加載不正確或者語法錯誤。簡單聚合物元素由於聚合物代碼錯誤而無法加載到IE中

定製element.html

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

 
<script> 
 
    class CustomElement extends Polymer.Element { 
 
    static get is() { 
 
     return "custom-element"; 
 
    } 
 
    constructor() { 
 
     super(); 
 
     this.textContent = "I'm a custom-element."; 
 
    } 
 
    } 
 
    customElements.define(CustomElement.is, CustomElement); 
 
</script>

的index.html

<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 
    <script type="application/javascript" src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script> 
 
    <link rel="import" href="custom-element.html"> 
 
</head> 
 

 
<body> 
 
    <custom-element></custom-element> 
 
</body> 
 

 
</html>

控制檯錯誤顯示爲 「預期 ':'」 和「語法錯誤「在諸如/polymer/lib/utils/case-map.html.js和/ polymer/lib/elements之類的文件中/dom-module.html.js。

有沒有其他人得到這個工作在IE 11?

+0

根據我的經驗,聚合物支持IE11是一個虛假,因爲瀏覽器後面有很多麻煩。例如,如果你開始得到一個有很多元素的非常複雜的網站,IE11會在一段時間後停止加載css,並且你需要重新加載頁面。 –

回答

1

IE11不承認這個語法類,因爲ES6規格: https://kangax.github.io/compat-table/es6/

class foo { 
    static bar() { 
     //..code.. 
    } 
} 

它只有這樣做的ES5的方式工作:

var foo = {}; 
foo.bar = function() { 
    // ..code.. 
} 

因此您可能需要使用Polymer 1.7+ Syntax是:

Polymer({ 
    is: 'custom-element', 
    ready: function(){this.textContent = "I'm a custom-element."}. 
}) 

或使用Babel作爲預處理器,將所有ES6代碼轉儲到ES2015。