styxlab / gatsby-theme-try-ghost

A Gatsby theme to build flaring fast blogs from headless Ghost CMS
MIT License
136 stars 56 forks source link

Support for Gatsby 4 #293

Open Mrtenz opened 2 years ago

Mrtenz commented 2 years ago

The gatsby-rehype-inline-images does not seem to support Gatsby 4 at the moment. With the following config:

    {
      resolve: 'gatsby-transformer-rehype',
      options: {
        filter: (node: Node) => node.internal.type === 'GhostPost',
        plugins: [
          'gatsby-rehype-inline-images'
        ]
      }
    }

I get this error when querying childHtmlRehype { html }:

{
  "errors": [
    {
      "message": "Cannot read property 'withWebp' of undefined",
      "locations": [
        {
          "line": 4,
          "column": 4
        }
      ],
      "path": [
        "ghostPost",
        "childHtmlRehype",
        "html"
      ],
      "extensions": {
        "stack": [
          "TypeError: Cannot read property 'withWebp' of undefined",
          "    at fluidImage (.../node_modules/gatsby-rehype-inline-images/gatsby-node.js:215:5)",
          "    at processImage (.../node_modules/gatsby-rehype-inline-images/gatsby-node.js:193:13)",
          "    at replaceNewImage (.../node_modules/gatsby-rehype-inline-images/gatsby-node.js:169:16)",
          "    at async Promise.all (index 3)",
          "    at module.exports (.../node_modules/gatsby-rehype-inline-images/gatsby-node.js:99:18)",
          "    at Function.Promise.each (.../node_modules/gatsby-transformer-rehype/extend-node-type.js:16:5)",
          "    at processHtmlAst (.../node_modules/gatsby-transformer-rehype/extend-node-type.js:142:7)"
        ]
      }
    }
  ],
  "data": {
    "ghostPost": {
      "childHtmlRehype": {
        "html": null
      }
    }
  },
  "extensions": {}
}
styxlab commented 2 years ago

@Mrtenz I no longer actively maintain this repo, because I now do everything with Next.js. However, If you want to submit a PR to fix the issue, you are most welcome.

lamellama commented 2 years ago

Only tested with Gatsby@v3 but it may also work for 4 https://github.com/styxlab/gatsby-theme-try-ghost/pull/294

illogic-al commented 2 years ago

If this still doesn't work perhaps a change in the gatsby-rehype-inline-images plugin similar to that in https://github.com/styxlab/gatsby-theme-try-ghost/pull/298 (where we are not mutating a node directly, but using createNodeField instead will fix things.

amaljithev commented 1 year ago

Still does not work @illogic-al , Can you submit a PR ?

illogic-al commented 1 year ago

@amaljithev I did submit a PR, that's what I linked to in #298. As I don't use this plugin I won't make the change here. I encourage you to copy those changes and make them for yourself, and as you are using the plugin you'll be able to test and verify that it works. If you run into any issues feel free to link to the PR in your fork and I'd be happy to see if the proper changes were made.