我的网站图片没有从带有 Gatsby 的 Github Pages 上的正确链接加载

Question

该网站是使用部署在 Github Pages 上的 Gastby 构建的。我的图片的链接应该是https://eoja82.github.io/lakeside-demo/img/employees/jake.jpg。但是，链接类似于https://eoja82.github.io/img/employees/jake.jpg，省略了/lakeside-demo 部分。

我在我的 gastby-config.js 文件中使用pathPrefix：

module.exports = {
  pathPrefix: "/lakeside-demo",
  plugins: [
    `gatsby-plugin-react-helmet`,
    `gatsby-transformer-json`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `./src/components/products/data/`
      }
    },
  ]
}

我的 package.json 文件中有以下脚本： "deploy": "gatsby build --prefix-paths && gh-pages -d public"

我尝试过使用 Gatsby 的 withPrefix 和 assetPrefix，但找不到任何可行的解决方案。

Github：https://github.com/eoja82/lakeside-demo
网址：https://eoja82.github.io/lakeside-demo/

任何建议将不胜感激！

Answer 1

withPrefix 这样使用应该可以工作：

<img className={styles.moreInfoImg} src={withPrefix("/img/loadedTruck.jpg")} alt="delivery truck" />