3

我们希望使用Service Worker来执行客户端源代码转换以用于开发目的。我们想使用Babel将 ES6+/ES2015 文件转换为 ES5 模块。

但是，在 Service Worker using 中包含浏览器版本importScripts的 babel会导致以下错误：

GET http://localhost:8080/babel-core/browser.js net::ERR_FAILED

Uncaught NetworkError: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:8080/babel-core/browser.js' failed to load.

那么，问题来了，如何正确地将 babel 导入到 Service Worker 中。

编辑：这不是明显的 NetworkError，因为我们可以将文件的内容更改为简单的内容，这使我们能够实际加载和执行文件。此外，可以使用普通<script>标签加载文件。

edit2：要获取此消息，请查看此存储库https://github.com/onsetsu/lively4-core.git，在端口 8080 启动本地服务器，最后加载http://localhost:8080/bootworker.html。我们目前使用的是 Chrome 44。

4

2 回答 2

3

How about my experiment here https://github.com/bahmutov/babel-service - you can see the demo at https://babel-service-demo.herokuapp.com/.

I am using feature tests to detect supported features and transpile the intercepted code selectively. Of course this is just a start and only maps default parameters to babel plugins, but more features could be mapped.

Also, the people behind feature tests are discussing the selective transpile https://github.com/getify/es-feature-tests/issues/9

于 2016-01-15T04:16:16.190 回答
2

作为一般规则，不推荐使用 Service Worker 来处理对网站功能至关重要的事情。Service Worker 旨在进行渐进式增强，并且您的站点应设计为在相关 Service Worker 不可用时仍可正常运行。

即使在支持服务工作者的浏览器中，如果用户重新加载或者这是第一次导航，在服务工作者有机会控制之前，也可能没有人控制您的页面。

为了回答您的具体问题，ServiceWorkerGlobalScope服务工作者代码的执行暴露了与普通页面的全局范围不同的功能，并且您尝试导入的脚本中的某些内容似乎browser.js假定了仅在普通页面中可用的功能。不幸的是，即使启用了调试器，Chrome 的 DevTools 也不会显示导致错误的特定语句，所以我不能说哪些确切的语句是无效的。

于 2015-08-13T15:02:06.423 回答