Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

--prefix-paths breaks gatsby-image in build

See original GitHub issue

Local Build runs fine when served, breaks after deploy because of --prefix-paths(i think)

running build and serve shows me my project working right. After I run npm run deploy to deploy with gh-pages, the --prefix-paths ran during deploy breaks the build.
The deploy should show img srcset as:
<img sizes="(max-width: 600px) 100vw, 600px" srcset="/PATHPREFIX/static/655054bd2b11872551ad6037bad00b9b/421ae/anayancy.jpg 150w>
rightsrcset

but after the --prefix-paths ran to deploy it changes to:
<img sizes="(max-width: 600px) 100vw, 600px" srcset="/static/655054bd2b11872551ad6037bad00b9b/421ae/anayancy.jpg 150w>
brokesrcset

Steps to reproduce

Reproduction Repo
Deployment of bug

Git clone reproduction Repo(master branch)
npm install
Gatsby Develop, view localhost8000 to preview that content was queried smoothly
Gatsby Build, gatsby serve localhost9000 to preview the optimized build
npm run deploy, gatsby serve and view githubpages deploy, the build is now broken

Expected result

src for images in deployed build should point to "/reponame/static/…’
working

Actual result

src for images in deployed build instead point to an invalid path of just ‘/static/’
notworking

Environment

System: OS: Windows 10 CPU: (4) x64 Intel(R) Core(TM) i3-8130U CPU @ 2.20GHz Binaries: npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD Languages: Python: 3.8.0 - /c/Users/pauli/AppData/Local/Programs/Python/Python38-32/python Browsers: Edge: 44.18362.449.0 npmPackages: gatsby: ^2.18.15 => 2.18.15 gatsby-image: ^2.2.37 => 2.2.37 gatsby-plugin-sharp: ^2.3.9 => 2.3.9 gatsby-source-filesystem: ^2.1.42 => 2.1.42 gatsby-source-graphql: ^2.1.29 => 2.1.29 gatsby-transformer-json: ^2.2.22 => 2.2.22 gatsby-transformer-sharp: ^2.3.9 => 2.3.9
hope i filled this out right, I haven’t submitted an issue on github before but I really got stuck on this problem, and cant tell if its a bug or if I’m doing something within gatsby thats too conflicting.
gh-pages, gatsby-transformer-json, and gatsby-image are the 3 packages that I feel are most significant with this issue.

Issue Analytics

State:
Created 4 years ago
Comments:6 (1 by maintainers)

Top GitHub Comments

2reactions

richsevioracommented, Dec 24, 2020

Can I suggest reopening this issue? Running gatsby clean solved the problem for me, so it sounds like there’s at least something here

1reaction

vhermeczcommented, Jul 6, 2020

The nondeterminism of the problem hints at a cache issue. Running a gatsby clean before the gatsby build did it for me.

Top Results From Across the Web

Gatsby build missing path prefix for images - Stack Overflow

For me the issue seems to have been that the paths were cached. Running gatsby clean and then gatsby build --prefix-paths again fixed...

Why is —prefix-paths breaking my build during gh-pages ...

My local build runs fine when I Gatsby serve it, but I'm using gh-pages to deploy and narrowed it down to path prefix...

Adding a Path Prefix - Gatsby

In-app linking By using the Gatsby Link component, paths will automatically be prefixed with the pathPrefix value assigned in your gatsby-config. js file....

Gatsby build : files not found / Failed to load resource

But after running gatsby build, your js plugins and fonts are all broken or missing So to fix this, first. ... gatsby build...

Gatsby Changelog | 5.3.0

gatsby -plugin-utils; gatsby-remark-images. There will be no API-breaking changes, your builds will continue to work. However, whenever you use the ...