[v9.0.x] Grafana/toolkit: Fix incorrect image and font generation for plugin builds (#52939)

Co-authored-by: Esteban Beltran <academo@users.noreply.github.com>
Co-authored-by: Esteban Beltran <esteban.beltran@elastic.co>

packages/grafana-toolkit/src/config/webpack/loaders.ts

@@ -1,6 +1,8 @@
 import fs from 'fs';
 import path from 'path';
 
+import { getPluginId } from '../utils/getPluginId';
+
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 const supportedExtensions = ['css', 'scss', 'less', 'sass'];
@@ -109,7 +111,7 @@ export const getFileLoaders = () => {
       test: /\.(png|jpe?g|gif|svg)$/,
       type: 'asset/resource',
       generator: {
-        publicPath: `img/`,
+        publicPath: `public/plugins/${getPluginId()}/img/`,
         outputPath: 'img/',
       },
     },
@@ -117,7 +119,7 @@ export const getFileLoaders = () => {
       test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
       type: 'asset/resource',
       generator: {
-        publicPath: `fonts/`,
+        publicPath: `public/plugins/${getPluginId()}/fonts/`,
         outputPath: 'fonts/',
       },
     },