title: Change font-face generated by webpack 5
body: <p>I'm using webpack 5, and trying to make it work with webfonts.</p>
  <p>The output directory is like this:</p>
  <pre><code>wwwroot
    bin
      mybundle.css
      mybundle.js
    fonts
      roboto.woff
      roboto.woff2
  </code></pre>
  <p>The output:</p>
  <pre class="lang-js prettyprint-override"><code>output: {
    path: path.join(__dirname, './wwwroot/'),
    publicPath: '',                           // prevents &quot;Error: Automatic publicPath is not supported&quot;
    // ...
  },
  </code></pre>
  <p>The resolver:</p>
  <pre class="lang-js prettyprint-override"><code>{
    test: /\.woff2?$/i,
    type: 'asset/resource',
    generator: { filename: 'bin/[base]' },
  }
  </code></pre>
  <p>Everything seems to work, except the generated font-face is wrong:</p>
  <pre class="lang-css prettyprint-override"><code>@font-face {
    font-family: &quot;Roboto&quot;;
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url(fonts/roboto.woff2) format(&quot;woff2&quot;);    /* !!! PROBLEM !!! */
  }
  </code></pre>
  <p>It generates <code>url(fonts/roboto.woff2)</code> instead of <code>url(/wwwroot/fonts/roboto.woff2)</code>. So the css won't find the webfonts.</p>
  <p>How do I prepend a <code>/wwwroot/</code>?</p>