Separate output path for fonts in webpacker v6

[sled]

In v6.0.0-beta.7 the images and fonts are outputted in the same images/ folder, i.e I get this in my manifest.json:

"/packs/media/images/24e1f7f06b6876bf398d.eot",
"/packs/media/images/6cf5f320e27be83645d8.woff",
"/packs/media/images/e8e73160b2e1347f5f75.woff2"

In my opinion it would make sense to change this to:

"/packs/media/fonts/24e1f7f06b6876bf398d.eot",
"/packs/media/fonts/6cf5f320e27be83645d8.woff",
"/packs/media/fonts/e8e73160b2e1347f5f75.woff2"

All that needs to be done is to split the file rules here and add a separate rule for fonts like this:

// rules/images.js
module.exports = {
  test: [
    /\.bmp$/,
    /\.gif$/,
    /\.jpe?g$/,
    /\.png$/,
    /\.tiff$/,
    /\.ico$/,
    /\.avif$/,
    /\.webp$/,
    /\.svg$/
  ],
  exclude: [/\.(js|mjs|jsx|ts|tsx)$/],
  type: 'asset/resource',
  generator: {
    filename: 'media/images/[hash][ext][query]'
  }
}

// rules/fonts.js
module.exports = {
  test: [
    /\.eot$/,
    /\.otf$/,
    /\.ttf$/,
    /\.woff$/,
    /\.woff2$/
  ],
  exclude: [/\.(js|mjs|jsx|ts|tsx)$/],
  type: 'asset/resource',
  generator: {
    filename: 'media/fonts/[hash][ext][query]'
  }
}

What do you think?

[guillaumebriday]

I opened this PR before seeing this issue: #3082

But what do you think to put everything in the static folder?

I see no need to split images and fonts even for caching 🤔 do I miss something?

[JoeWoodward]

Also experiencing this

[sled]

I opened this PR before seeing this issue: #3082

But what do you think to put everything in the static folder?

I see no need to split images and fonts even for caching 🤔 do I miss something?

No need to have explicit paths, it’s a purely cosmetic issue. Putting all assets in the static would be a good solution to keep things consistent.

[guillaumebriday]

Ok fine, I close the issue then 👌

Thanks!