TypeError: publicPath.replace is not a function when output.publicPath of webpack config is a function

[roland-reed]

Bug report

When using function in output.publicPath of Webpack config, the loader of mini-css-extract-plugin seems to handle this situation incorrectly and leading to an error(see below).

If this is a bug, I'm glad to make a PR

Actual Behavior

assets by status 822 bytes [cached] 1 asset
runtime modules 663 bytes 3 modules
cacheable modules 71 bytes
  ./src/index.js 32 bytes [built] [code generated]
  ./src/index.css 39 bytes [built] [code generated] [1 error]

ERROR in ./src/index.css
Module build failed (from ./node_modules/.pnpm/mini-css-extract-plugin@2.4.5_webpack@5.64.4/node_modules/mini-css-extract-plugin/dist/loader.js):
TypeError: publicPath.replace is not a function
    at Object.pitch (/Users/username/Workspace/test/webpack-demo/node_modules/.pnpm/mini-css-extract-plugin@2.4.5_webpack@5.64.4/node_modules/mini-css-extract-plugin/dist/loader.js:176:114)
 @ ./src/index.js 1:0-21

webpack 5.64.4 compiled with 1 error in 285 ms

Expected Behavior

Expect no errors would be throw.

How Do We Reproduce?

Reproduce repository: https://github.com/roland-reed/mini-css-extract-plugin-function-public-path, steps are listed in README.md

I dig a little and find that the following code should be related:

mini-css-extract-plugin/src/loader.js

Lines 182 to 192 in e8c08a1

	if (typeof options.publicPath === "string") {
	// eslint-disable-next-line prefer-destructuring
	publicPath = options.publicPath;
	} else if (typeof options.publicPath === "function") {
	publicPath = options.publicPath(this.resourcePath, this.rootContext);
	}
	if (publicPath === "auto") {
	publicPath = AUTO_PUBLIC_PATH;
	}

Please paste the results of npx webpack-cli info here, and mention other relevant information

 npx webpack-cli info

  System:
    OS: macOS 12.0.1
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
    Memory: 40.96 MB / 32.00 GB
  Binaries:
    Node: 14.15.4 - ~/.nvm/versions/node/v14.15.4/bin/node
    Yarn: 1.22.11 - ~/.nvm/versions/node/v14.15.4/bin/yarn
    npm: 6.14.10 - ~/.nvm/versions/node/v14.15.4/bin/npm
  Browsers:
    Chrome: 96.0.4664.55
    Firefox: 94.0.1
    Safari: 15.1
  Packages:
    css-loader: 6.5.1 => 6.5.1 
    webpack: 5.64.4 => 5.64.4 
    webpack-cli: 4.9.1 => 4.9.1 

[roland-reed]

any update on this issue?