Images in remotes (angular 12 project)

[hrm123]

I add image (boutique.jpg) in asstes folder in the remote (angular project -50001 port) and refer in css of remote code (.html file) using

.styleBoutique{
background:url('../../assets/boutique.jpg');

When remote is rendered in the host (angular project port 5000) website the css style changes to

{
background: url(boutique.jpg); //* note there is no assets folder reference or even reference to remotes port *//

and fails to load.

How to resolve this issue?

[ScriptedAlchemy]

Mini-css v2.0 should solve this with its ability to resolve public path auto.

[hrm123]

added
'module': {
rules: [
{
test: /.css$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: 'auto'
}
},
{
loader: "css-loader"
}
]
}
]
}
to web pack of host.
error is -
Generating browser application bundles (phase: setup)...An unhandled exception occurred: ObjectMiddleware.register: serializer for mini-css-extract-plugin/dist/CssModule/null is already registered