Workbox -如何让服务人员档案被webpack转译？

Question

我目前正在使用workbox-webpack-plugin的GenerateSW插件生成一个服务工作者文件

new GenerateSW({
    cacheId: 'foo',
    clientsClaim: true,
    inlineWorkboxRuntime: true,
    runtimeCaching: [
         {
              urlPattern: /^https:\/\/fonts\.googleapis\.com.*/,
              handler: 'StaleWhileRevalidate',
         },
    ],
    skipWaiting: true,
    sourcemap: false,
    swDest: 'sw.js',
}),

生成的sw.js文件包含由注入其中的GenerateSW插件生成的代码。但是，这段代码没有被转换，我需要它被转换，因为Google决定用哪个ecmascript版本来编写它是独立于我的。我可以在webpack运行后使用babel转换sw.js文件，但我想知道是否有方法可以简单地自动转换此文件(最好使用与webpack本身使用的相同的env信息)？

Answer 1

假设您正在使用workbox-webpack-plugin v5+，您可以使用pass in babelPresetEnvTargets来配置所生成的服务工作者的转换过程。

new GenerateSW({
  // Use the Array<string> syntax from
  // https://babeljs.io/docs/en/babel-preset-env#targets
  babelPresetEnvTargets: ['chrome >= 80'],

  // ...other options...
}),