webcomponents-sd-ce-pf.js 的用途是什么

What is the purpose for webcomponents-sd-ce-pf.js

我正在构建一个基于 web 组件的应用程序,我正在删除我的包中不必要的代码。为了编译 es5 元素,我添加了 webcomponentsjs polyfills,它建议附加两个脚本文件:

"node_modules/@webcomponents/webcomponentsjs/bundles/webcomponents-sd-ce-pf.js"
"node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"    

似乎没有适配器我就无法离开,但没有 webcomponents-sd-ce-pf.js 似乎工作正常。我想问一下它的用途。文档对此似乎有点含糊。

如果您想支持 IE 或(旧版)Edge,您将需要它。

它们是 webcomponents polyfill。

  • webcomponents-sd-ce-pf.js

sd(阴影 DOM),ce(自定义元素),pf(polyfill)

  • custom-elements-es5-adapter.js

According to the spec, only ES6 classes (https://html.spec.whatwg.org/multipage/scripting.html#custom-element-conformance) may be passed to the native customElements.define API. For best performance, ES6 should be served to browsers that support it, and ES5 code should be serve to those that don't. Since this may not always be possible, it may make sense to compile and serve ES5 to all browsers. However, if you do so, ES5-style custom element classes will now not work on browsers with native Custom Elements because ES5-style classes cannot properly extend ES6 classes, like HTMLElement.

github: https://github.com/webcomponents/polyfills