我正在使用workbox webpack插件v3.01和webpack v3.11 .

我的webpack构建将index.html输出到wwwroot文件夹中，该文件夹是src的兄弟 . 捆绑包进入wwwwroot / dist文件夹 . 所以，为了缓存index.html，我需要将服务工作者输出到wwwroot . 部署时，我不希望任何明显的wwwroot引用 .

Webpack output configuration:

const bundleOutputDir = "./wwwroot/dist";
...
output: {
       path: path.join(__dirname, bundleOutputDir),
       filename: "[name].js",
       publicPath: "/dist/"
    }

Workbox configuration:

new workboxPlugin.GenerateSW({
                              swDest: path.join("../../wwwroot", "sw.js"),
                              clientsClaim: true,
                              skipWaiting: true,
                              importWorkboxFrom: 'local',
                              runtimeCaching: [
                                  {
                                      urlPattern: new RegExp("/api/"),
                                      handler: "networkFirst"
                                  }
                              ]
                          })

除插件外，一切正常 . 在生成的sw.js中我看到了问题：

importScripts("/dist/workbox-v3.0.1/workbox-sw.js");
workbox.setConfig({modulePathPrefix: "workbox-v3.0.1"});

importScripts(
  "/dist/precache-manifest.e5343547924aadc82abad909b11fc508.js"
);

因此，workbox-sw.js文件是从正确的位置导入的 . 但是，modulePathPrefix不正确 . 我相信如果modulePathPrefix包含/ dist /，它会工作 .

我发现了一个类似的github问题（它用于清单注入而不是GenerateSW），它表明webpack输出部分中配置的publicPath存在问题 .

我一直在尝试各种配置更改，这些更改当然都是相互关联的 . 我希望我能以某种方式指定正确的modulePathPrefix .

webpack workbox