Question

设置：Webpack运行svelte-loader，然后运行babel-loader

问题：即使现在其他旧的浏览器都可以运行该精简代码，safari 9也会失败

TypeError: type error

在_isNativeFunction()类上对HTMLElement的babel调用中。

Answer 1

似乎svelte在其某些已编译代码中扩展了HTMLElement类，而babel显然将用 _wrapNativeSuper(HTMLElement)，因为它不是ES5。

wrapNativeSuper是一个babel方法，最终调用_isNativeFunction，并且_isNativeFunction希望传递一个函数。不幸的是，在较旧的safari中（且仅在较旧的safari中），HTMLElement不是函数，因此_isNativeFunction即使在理论上将代码转译为与safari 9一起使用时，也会抛出typeError！

到目前为止，我发现的骇客解决方案来自以下关于Safari方面的大约2015年的帖子：

https://github.com/google/traceur-compiler/issues/1709

https://github.com/babel/babel/issues/1548

Should I write v1 Custom Elements in a way that is backwards compatible with v0 API?

因此，这种黑客行为在过去似乎是众所周知的-基本上只需添加垫片即可使HTMLElement像一个函数一样进行响应：

if (typeof HTMLElement !== 'function'){
    var _HTMLElement = function(){};
    _HTMLElement.prototype = HTMLElement.prototype;
    HTMLElement = _HTMLElement;
}

在加载任何前端资源之前，我将上面的代码放入其中，它很吸引人。

进一步的问题：这样做有危险吗？有没有更好的办法？作为safari 9支持的一部分，babeljs应该注意这些问题吗？

如何使用Babel将已编译的svelte转换为Safari 9

1 个答案: