gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.28k stars 10.31k forks source link

pathPrefix/assetPrefix did not work well with images #36491

Open quangvietnguyen opened 2 years ago

quangvietnguyen commented 2 years ago

Preliminary Checks

Description

When I have used gh-pages to generate static files from wordpress , I have url https://<name>.github.io and pathPrefix: /<foldername>. But when the plugin created the folder to store the images, they are stored in https://<name>.github.io/_gatsbyimage, not https://<name>.github.io/<foldername>/_gatsbyimage. Then the network return a 404 for the images call. I thought this might relate to the absolute path or relative path things.

Reproduction Link

https://www.vietnguyen.blog

Steps to Reproduce

  1. Create a wordpress page
  2. Create a gatsby portfolio page
  3. install gatsby-source-plugin
  4. use gh-pages command to build blog pages

Expected Result

the picture should be loaded

Actual Result

404 when get the picture assets

Environment

System:
    OS: macOS 12.5.1
    CPU: (8) x64 Apple M1
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 14.18.2 - ~/.nvm/versions/node/v14.18.2/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v14.18.2/bin/yarn
    npm: 8.6.0 - ~/.nvm/versions/node/v14.18.2/bin/npm
  Browsers:
    Chrome: 104.0.5112.101
    Firefox: 102.0.1
    Safari: 15.6.1
  npmPackages:
    gatsby: ^4.19.2 => 4.19.2
    gatsby-plugin-emotion: ^7.16.0 => 7.16.0
    gatsby-plugin-google-analytics: ^4.15.0 => 4.15.0
    gatsby-plugin-image: ^2.15.1 => 2.15.1
    gatsby-plugin-manifest: ^4.15.1 => 4.15.1
    gatsby-plugin-material-ui: ^4.1.0 => 4.1.0
    gatsby-plugin-react-helmet: ^5.15.0 => 5.15.0
    gatsby-plugin-sass: ^5.15.1 => 5.15.1
    gatsby-plugin-sharp: ^4.15.1 => 4.15.1
    gatsby-plugin-sitemap: ^5.15.1 => 5.15.1
    gatsby-plugin-vanilla-extract: ^2.0.1 => 2.0.1
    gatsby-source-airtable: ^2.3.0 => 2.3.0
    gatsby-source-contentful: ^7.14.0 => 7.14.0
    gatsby-source-filesystem: ^4.15.0 => 4.21.1
    gatsby-source-wordpress: ^6.21.1 => 6.21.1
    gatsby-transformer-json: ^4.16.0 => 4.16.0
    gatsby-transformer-sharp: ^4.15.1 => 4.15.1
  npmGlobalPackages:
    gatsby-cli: 4.7.0

Config Flags

No response

LekoArts commented 2 years ago

This will be fixed with https://github.com/gatsbyjs/gatsby/pull/36772