How to use runtime setting of __webpack_public_path__ and extract-text-webpack-plugin

[rebelrebel82]

What is the best approach for setting the public path in runtime and
loading the stylsheet generated by extract-text-webpack-plugin so that the images used in the stylesheet will refer to the public path?

[alotabits]

Not an authoritative answer here, but I don't think this is possible. I've been dealing with a similar issue and the way I've handled it is to use several webpack rules with different filename tests and different publicPath values when calling .extract({ publicPath: ..., use: cssLoader }). It's not a full runtime solution, but it works if you have a limited set of publicPaths to support.

[alexander-akait]

@rebelrebel82 Can your provide use case for this? Better with minimum reproducible test repo, thanks!

[nourspace]

Any solution for this?

The use case would be building a client app without targeting a particular environment, and then at runtime populating __webpack_public_path__ with a server side printed value to a window variable like window.publicPath.

Webpack entry point

__webpack_public_path__ = window.publicPath;