diff --git a/packages/gatsby-plugin-manifest/src/gatsby-node.js b/packages/gatsby-plugin-manifest/src/gatsby-node.js
index d9faf2877e38f..245db2ee6226d 100644
--- a/packages/gatsby-plugin-manifest/src/gatsby-node.js
+++ b/packages/gatsby-plugin-manifest/src/gatsby-node.js
@@ -58,7 +58,7 @@ async function checkCache(cache, icon, srcIcon, srcIconDigest, callback) {
 }
 
 exports.onPostBootstrap = async (
-  { reporter, parentSpan },
+  { reporter, parentSpan, basePath },
   { localize, ...manifest }
 ) => {
   const activity = reporter.activityTimer(`Build manifest and related icons`, {
@@ -68,7 +68,7 @@ exports.onPostBootstrap = async (
 
   let cache = new Map()
 
-  await makeManifest(cache, reporter, manifest)
+  await makeManifest({ cache, reporter, pluginOptions: manifest, basePath })
 
   if (Array.isArray(localize)) {
     const locales = [...localize]
@@ -84,23 +84,44 @@ exports.onPostBootstrap = async (
           cacheModeOverride = { cache_busting_mode: `name` }
         }
 
-        return makeManifest(
+        return makeManifest({
           cache,
           reporter,
-          {
+          pluginOptions: {
             ...manifest,
             ...locale,
             ...cacheModeOverride,
           },
-          true
-        )
+          shouldLocalize: true,
+          basePath,
+        })
       })
     )
   }
   activity.end()
 }
 
-const makeManifest = async (cache, reporter, pluginOptions, shouldLocalize) => {
+/**
+ * The complete Triforce, or one or more components of the Triforce.
+ * @typedef {Object} makeManifestArgs
+ * @property {Object} cache - from gatsby-node api
+ * @property {Object} reporter - from gatsby-node api
+ * @property {Object} pluginOptions - from gatsby-node api/gatsby config
+ * @property {boolean} shouldLocalize
+ * @property {string} basePath - string of base path frpvided by gatsby node
+ */
+
+/**
+ * Build manifest
+ * @param {makeManifestArgs}
+ */
+const makeManifest = async ({
+  cache,
+  reporter,
+  pluginOptions,
+  shouldLocalize = false,
+  basePath = ``,
+}) => {
   const { icon, ...manifest } = pluginOptions
   const suffix =
     shouldLocalize && pluginOptions.lang ? `_${pluginOptions.lang}` : ``
@@ -196,6 +217,11 @@ const makeManifest = async (cache, reporter, pluginOptions, shouldLocalize) => {
     }
   }
 
+  //Fix #18497 by prefixing paths
+  manifest.icons = manifest.icons.map(icon => {
+    return { ...icon, src: path.join(basePath, icon.src) }
+  })
+
   //Write manifest
   fs.writeFileSync(
     path.join(`public`, `manifest${suffix}.webmanifest`),