publicPath not doing anything

This might be related to #222.

• Operating System: Windows 10
• Node Version: v10.12.0
• NPM Version: v6.9.0
• webpack Version: v4.32.2
• mini-css-extract-plugin Version: v0.6.0

Expected Behavior

publicPath should overwrite the output directory specified in output.path

Actual Behavior

Using publicPath doesn’t seem to do anything. If it’s defined as a function it does get called, but the return value is never used.

Code

module: {
	rules: [
		{
			test: /\.tsx?$/,
			use: 'ts-loader',
			exclude: /node_modules/
		},
		
		{
			test: /\.s?css$/,
			use: [
				{
					loader: MiniCssExtractPlugin.loader,
					options: {
						publicPath: 'any/path/absolute/or/relative'
					}
				},
				'css-loader'
			]
		}
	]
}

Full config

How Do We Reproduce?

By using the configuration above.

[alexander-akait]

Please create minimum reproducible test repo

[alessiofachechi]

Despite I landed here for the same reason described by @HoldYourWaffle, now that I’ve better read the docs of both MiniCssExtractPlugin and webpack.output I think that there’s a misunderstanding about the expected behavior of the plugin’s publicPath option.

What we’re currently expecting from the publicPath option is what in the case of webpack.output is done by path. But webpack.output allows for publicPath too. According to the docs the former is the output directory as an absolute path, while the latter specifies the public URL of the output directory when referenced in a browser.

In a few words what we wanted here is path, not publicPath. And the path behavior can be achieved through the plugin filename option, as already said in some comments above.

  output: {
    filename: 'main.js',
    path: path.resolve(__dirname, 'dist'),
  },
  plugins: [
    new MiniCssExtractPlugin({
      // path relative to the output.path
      // e.g. assets/style/main.css => dist/assets/style/main.css
      filename: 'assets/style/[name].css',
    })
  ],