title: Webpack 5 import images and fonts, rewrite url in prod
body: <p>I need to copy the image and font files to the appropriate folder in the dist directory, the problem is that in the final css file I get the wrong url path. I tried to disable url <code>css-loader</code> then files are not copied at all. Tried adding <code>~</code> to url .
  I need to use <code>asset/resource</code> to copy and paste the correct path in the stylesheet. Various other outdated solutions won't work for me.</p>
  <p><a href="https://codesandbox.io/s/gallant-poitras-llmkt?file=/webpack.fonfig.js" rel="nofollow noreferrer">My webpack 5 config</a></p>
  <p><strong>I import file less to main.js.</strong></p>
  <p><strong>My folder structure</strong></p>
  <p><a href="https://i.stack.imgur.com/P8och.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/P8och.png" alt="MY STRUCTURE" /></a></p>