Images render blurred when deploying gatsby site to Github Pages
See original GitHub issueLocally, my website works well with gatsby develop
, but but as soon as i try to deploy my website to github-pages, images render blurred and sidebar links ar not working and redirecting wrongly.
Anyway i want to fix the first issue about Images problem because i have png and gif.
but they brook.
Issue Analytics
- State:
- Created 3 years ago
- Reactions:2
- Comments:14 (7 by maintainers)
Top Results From Across the Web
Gatsby Image Not Working - Images Blurry on Deploy or does ...
Problem: I cannot get images to load using gatsby-image in my deployment to github pages - it works on my local machine. If...
Read more >Gatsby Netlify LFS Source Plugin
One of Gatsby's primary draws is how it handles images with gatsby-plugin-image . Gatsby can also be deployed for free from a git...
Read more >Starting a technical blog in 2021 - Gatsby + Github Pages ...
I copied the definition shamelessly from the Gatsby's website. ... generate fluid images, add filters, change formats, blur up on load and a ......
Read more >How I made my portfolio website blazing fast with Gatsby
Gatsby takes care of rendering at build time to the DOM as static HTML, CSS, and JavaScript. Gatsby-image Component is BAE. So now...
Read more >next/image - Next.js
Note: This page is the API reference for the next/image component. For a feature overview and usage information, please see the Image Component...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I am also experiencing this issue - it appears for me that gatsby is non-deterministically sometimes choosing to add a
pathPrefix
to my image src urls and sometimes not (this is the path prefix for github pages, set ingatsby-config.js
).I haven’t been able to reproduce it reliably and I’ve found running a deploy to github pages several times appears to fix it. Will update if I learn more.
@hkair Without a reproduction repo and preferably live site, you aren’t likely to get any action taken.