manifest file generated by workbox-webpack-plugin has wrong public path when using file-loader

[hxlniada]

Library Affected:
workbox-webpack-plugin: 3.3.1

Browser & Platform:
webpack: 4.14.0 node: 8.11.2

here is my webpack config:

    mode: 'production',
    output: {
        filename: 'assets/fm/product/js/[name].[chunkhash:7].js',
        publicPath: 'https://s1-8.bdimg.com/'
    },
    module: {
        rules: [{
            test: /\.scss$/,
            use: [
                {loader: MiniCssExtractPlugin.loader},
                {loader: 'css-loader', options: {importLoaders: 1, minimize: true}},
                'postcss-loader',
                'sass-loader'
            ]
        }, {
            test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
            loader: 'url-loader',
            options: {
                publicPath: 'https://s2-8.bdimg.com/',
                limit: 5000,
                name: 'assets/fm/product/img/[name].[hash:7].[ext]'
            }
        }, {
            test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
            loader: 'url-loader',
            options: {
                publicPath: 'https://s2-8.bdimg.com/',
                limit: 5000,
                name: 'assets/fm/product/fonts/[name].[hash:7].[ext]'
            }
        }]
    },
    plugins: [
        ...
        new HtmlWebpackPlugin({
            filename: 'template/fm/product/index.html'
             ...
        }),
        new WorkboxPlugin.GenerateSW({
            swDest: 'assets/fm/product/js/service-worker/sw.js',
            importWorkboxFrom: 'local',
            importsDirectory: 'assets/fm/product/js/service-worker',
            dontCacheBustUrlsMatching: /\.\w{7}\./
        })
    ],

the generated manifest file is:

  {
    "revision": "70f38c4d2e7a5029e57a",
    "url": "https://s1-8.bdimg.com/assets/fm/product/css/24.315b155.css"
  },
  {
    "revision": "59227a7aa8d8c66e30d1a296c694beda",
    "url": "https://s1-8.bdimg.com/template/fm/product/index.html"
  },
  {
    "revision": "70f38c4d2e7a5029e57a",
    "url": "https://s1-8.bdimg.com/assets/fm/product/js/24.70f38c4.js"
  },
  {
    "revision": "c933eb1b2645bb46a1e9",
    "url": "https://s1-8.bdimg.com/assets/fm/product/css/1.593ab4f.css"
  },
  ...
  {
    "revision": "00454803c8a180107037cef5f09530a7",
    "url": "https://s1-8.bdimg.com/assets/fm/product/img/sell-out.0045480.png"
  },
  {
    "revision": "4cc015d5335c7ac89b77a8eccad70a13",
    "url": "https://s1-8.bdimg.com/assets/fm/product/img/blank-icon.4cc015d.png"
  },
  {
    "revision": "219c8350a2b30e2cf33d60fc305b3a23",
    "url": "https://s1-8.bdimg.com/assets/fm/product/fonts/DIN-Medium.219c835.ttf"
  },
  {
    "revision": "e8d1f3c9afdbf68f1f10ad7c6e998546",
    "url": "https://s1-8.bdimg.com/assets/fm/product/fonts/DIN-Regular.e8d1f3c.eot"
  },
  {
    "revision": "c730e18d8fe151067a097841b83db83e",
    "url": "https://s1-8.bdimg.com/assets/fm/product/fonts/DIN-Medium.c730e18.eot"
  }

notice the public path of fonts and images what I configured in url-loader is s2-8.bdimg.com, but the generated path is https://s1-8.bdimg.com/...

by the way.

the index.html file should not has an CDN path and I wan't to replace the '/template' prefix to '' too. but I can't find a way to change both of them. so depressed.

[jeffposnick]

I took a look through what's exposed in the compilation that's passed to our plugin instance, and I don't see anything that references the custom options.publicPath value that might be set when using file-loader/url-loader.

So, unless anyone more familiar with webpack's compilation / plugin architecture knows of some way of getting that value, there doesn't appear to be a way for our plugin to figure out that your final, effective URL is going to be modified by a custom publicPath prefix that the loader assigns.

The best way forward is probably going to be along the lines of #1227 and open things up to allow folks to transform the precache manifest when using the webpack plugin. That at least provides an escape hatch if we can't automatically infer certain information.

[jeffposnick]

This should be addressed in workbox-webpack-plugin v5. If you need to make any translations to the URL prefixes, you can either use the modifyURLPrefix or manifestTransforms configuration options.