5

项目描述:使用 Gatsby 创建一个作品集网站来展示我的 JavaScript 项目。

问题:我无法在部署到 github 页面时使用 gatsby-image 加载图像 - 它适用于我的本地计算机。如果我使用 childImageSharp.fixed 它是模糊的,如果我使用 childImageSharp.noBase64 图像根本不会显示。

我试过的:我试过删除我的公共和 .cache 文件夹并重建(很多次) - 没用。我曾尝试使用旧版本的 Gatsby 和 gatsby-images 这不起作用,它似乎破坏了其他东西。我尝试过提高质量,但更改了一些设置,但没有奏效。这些都是我在过去几天阅读的其他 StackOverflow 帖子中尝试过的所有内容。

*注意:我也尝试不使用 Gatsby 图像,即使没有 Gatsby 图像,您也会在我的查询中看到很多其他数据,我无法让图像显示没有损坏。但是使用 gatsby 图像,如我上面所述,它要么是模糊的要么是空白的。

Github 仓库: https ://github.com/mk0b/gatsby-portfolio-site

实时 Github 页面站点: https ://mk0b.github.io/gatsby-portfolio-site/

**关于结构的注释 - 我的 graphQL 查询位于 Projects.js 中,并将所有信息传递给 Project.js,然后使用 gatsby 图像。

感谢您提前提供任何帮助/指导!

4

2 回答 2

4

对于 github 页面,需要单独指定公共路径。

盖茨比-config.js

pathPrefix: '/gatsby-portfolio-site',

包.json

"build": "gatsby build --prefix-paths",

祝你好运!

于 2020-07-05T09:49:31.117 回答
2

在我的一个闲散社区中,有人建议我尝试使用 Netlify 而不是 github 页面,并且图像可以与 Netlify 部署一起使用。所以这没有解决,但不再紧迫。

于 2020-03-16T19:21:03.923 回答