如何在Polymer 2.0中启用Shady DOM？

Question

Polymer 1.x默认使用 Shady DOM ，但可以在初始化时通过在导入window.Polymer之前设置polymer.html对象来更改，如下所示：

<script>window.Polymer = {dom: 'shadow'};</script>
<link rel="import" href="polymer.html">

然而，无论window.Polymer = {dom: 'shady'}如何，似乎Polymer 2.0都使用 Shadow DOM 。如何切换到Shady DOM？

Answer 1

Shady DOM垫片为factored out of Polymer in 2.0并移入v1 Web Components polyfill。

要启用Shady DOM（而不是默认的Shadow DOM），请在导入v1 window.ShadyDOM之前定义以下webcomponents-lite.js对象：

<script>window.ShadyDOM = { force: true };</script>
<script src="webcomponentsjs/webcomponents-lite.js"></script>

codepen

更新：更简单的设置是在[shadydom]代码上指定<script>：

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

codepen