CSS refers to webfonts through an absolute path.

[guusdk]

converse.css and converse.min.css refer to the webfont location using an absolute path (under /dist/webfonts/

This makes it problematic to host Converse on a webserver in a context root other than one that is called 'dist'.

Please make the webfont location configurable or relative.

[joudinet]

I tried to make this location depends on __webpack_public_path__ variable instead of using the hardcoded /dist but I failed.
This is what I tried:

• update file-loader to version 4.2.0
• use the option postTransformPublicPath as described here:
  https://github.com/webpack-contrib/file-loader#posttransformpublicpath

I've added the two following lines to webpack.common.js:

publicPath: 'webfonts/',
postTransformPublicPath: (p) => `__webpack_public_path__ + ${p}`

Unfortunately, make dist continues to generate a css file with hardcoded /dist in the webfont location :-(

[allo-]

The issue is still present in 6.0.0 and I would like to use it with relative paths, too.

[jcbrand]

I'm not sure what can/should be done to fix this.

Here's a relevant webpack issue: webpack-contrib/css-loader#155

From that issue:

To use a runtime public path:

You must not use the extract-text-webpack-plugin.
You must set webpack_public_path before referencing the stylesheets or images. (ES6 imports is moved to the top, be careful. Best use a extra file for setting the runtime path)

We already do that AFAICT, in src/entry.js.

[jcbrand]

As a workaround, you can build your own dist files and then specify the ASSET_PATH to be used for the webfonts.

Like this: ASSET_PATH=https://example.org/dist/ make dist

[jcbrand]

I've made a fix to not rewrite url() paths in CSS. That means that assets are now loaded relative to the CSS file itself, which I believe resolves this issue.

[joudinet]

Great, thanks. I'll test it when 7f69394 will be included in a release.