Gatsby Build失败：Truncated Page data information报错求助

我有一个多页面Gatsby站点，gatsby develop运行正常，但执行gatsby build准备部署时失败，报错如下：

Truncated Page data information for page... 
Building static HTML failed for path "/wallet/WalletPage

我怀疑是pages文件夹结构的问题，当前结构如下：

pages/
- about/About.js
- bank/BankPage.js
- partner/Partner.js
- wallet/ Wallet.js
- 其他页面

错误信息、文件夹结构及Gatsby配置截图：

起初以为是存在未加入路由的废弃页面，清理了相关内容并清除缓存，但问题依旧。

站点原本是静态单页，后来扩展为多页面，部分页面有请求外部服务获取数据的逻辑，现在需要先解决这个build报错问题。

gatsby-config.js #

module.exports = {
  siteMetadata: {
    title: `changex`,
    siteUrl: `https://www.changex.io`,
    description: `Non-custodial DeFi wallet with integrated banking and Visa Debit Card. Buy crypto, invest, and grow your wealth on easy mode.`
  },
  plugins: [{
    resolve: 'gatsby-plugin-google-analytics',
    options: {
      "trackingId": "UA-221374557-1"
    }
  },
    "gatsby-plugin-image",
    "gatsby-plugin-react-helmet",
    "gatsby-plugin-sitemap",
    {
    resolve: 'gatsby-plugin-manifest',
    options: {
      "icon": "src/assets/images/icon.png"
    }
  },
    "gatsby-plugin-mdx",
    "gatsby-transformer-remark",
    "gatsby-plugin-sharp",
    "gatsby-transformer-sharp", {
    resolve: 'gatsby-source-filesystem',
    options: {
      "name": "images",
      "path": "static/images/"
    },
    __key: "images"
  }, {
    resolve: 'gatsby-source-filesystem',
    options: {
      "name": "pages",
      "path": "./src/pages/"
    },
    __key: "pages"
  }],
  flags: {
    DEV_SSR: true
  }
};

index.js #

import * as React from "react";
import {useEffect, useLayoutEffect} from "react";
import { HashRouter as Router, Routes, Route, useLocation} from "react-router-dom";

import { fetchApy, fetchPrice } from "../api/fetch";

import CookieConsentModal from "../Utils/CookieConsent";
import MetaDecorator from "../Utils/MetaDecorator";
import Home from "../components/Home/Home";
import Navigation from "../components/Navbar/Nav";
import Footer from "../components/Footer";
import NotFoundPage from "./404";
import BankPage from "./bank/BankPage";
import WealthPage from "./wealth/WealthPage";
import TokenPage from "./Token/TokenPage";
import About from "./about/About";
import WalletPage from "./wallet/WalletPage";
import Tokens from "./Token/Tokens";
import Partner from "./partner/Partner";
import content from "../../static/assets/content/content.json";
import {ScrollToTop} from "../Utils/ScrollToTop";

const imageUrl = "/assets/images/OG.jpeg";

const IndexPage = () => {
    useEffect(() => {
        fetchPrice().catch((err) => {
            console.log(`Fetch Price failed ${err}`);
        });

        fetchApy().catch((err) => {
            console.log(`Fetch Apy failed, ${err}`);
        });

        setTimeout(fetchPrice, fetchApy, 30000);
    }, []);

    return (
        <Router>
            <CookieConsentModal />
            <MetaDecorator
                description={content.pageDescription}
                title={content.pageTitle}
                imageAlt={content.metaImageAlt}
                imageUrl={imageUrl}
            />
            <Navigation />
            <main className="pages">
                <ScrollToTop>
                <Routes>
                    <Route path="/" element={<Home />} />
                    <Route path="/bank" element={<BankPage />} />
                    <Route path="/wealth" element={<WealthPage />} />
                    <Route path="/wallet" element={<WalletPage />} />
                    <Route path="/token-page" element={<TokenPage />} />
                    <Route path="/supported-tokens" element={<Tokens />} />
                    <Route path="/about" element={<About />} />
                    <Route path="/partner" element={<Partner />} />
                    <Route path="*" element={<NotFoundPage />} />
                </Routes>
                </ScrollToTop>
            </main>
            <Footer />
        </Router>
    );
};

export default IndexPage;

gatsby-node.js #

exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
    if (stage === "build-html" || stage === "develop-html") {
        actions.setWebpackConfig({
            module: {
                rules: [
                    {
                        test: /react-multi-carousel/,
                        use: loaders.null(),
                    },
                    {
                        test: /antd/,
                        use: loaders.null(),
                    },
                    {
                        test: /react-scroll/,
                        use: loaders.null(),
                    },
                    {
                        test: /@sendgrid/,
                        use: loaders.null(),
                    },
                    {
                        test: /animate.css/,
                        use: loaders.null(),
                    },
                    {
                        test: /axios/,
                        use: loaders.null(),
                    },
                    {
                        test: /emailjs-com/,
                        use: loaders.null(),
                    },
                    {
                        test: /@ant-design/,
                        use: loaders.null(),
                    },
                    {
                        test: /scrollable-component/,
                        use: loaders.null(),
                    }],
            },
        });
    }
};

内容的提问来源于stack exchange，提问作者jojo2345