MichaelDeBoey/gatsby-remark-embedder

The plugin doesn't work for Gatsby 4

Closed this issue ยท 16 comments

  • gatsby version: 4.4.0
  • gatsby-transformer-remark version: 5.4.0
  • gatsby-remark-embedder version: 6.0.0
  • node version: 14.15.0
  • npm version: 6.14.13

Relevant code or config

    {
      resolve: `gatsby-transformer-remark`,
      options: {
        plugins: [
          {
            resolve: `gatsby-remark-embedder`,
            options: {
              customTransformers: [],
              services: {
                // The service-specific options by the name of the service
              },
            },
          },
        ],
      },
    },

What you did: Installed the plugin

What happened: The embedding feature didn't work

Problem description: I'm using gatsby-transformer-remark and I've added the gatsby-remark-embedder to the plugin array.
I've left 2 empty lines between the url in my markdown. When I open the page the url is just a string and no embedding has happened.

I cleared the Gatsby cash and I put a console.log statement on top of the main function of the plugin(through node_modules) but nothing was logged. My opinion is that gatsby-transformer-remark doesn't call the gatsby-remark-embedder. The gatsby-transformer-remark works fine because I use it for other things.

@antogada Can you please provide me with a reproduction repo/CodeSandbox that I can look into?

https://github.com/mattchannn/gatsby-starter-sample

Hi Michael, I think you can refer to this one, I have the same issue in my blog. This is the best I could give it to you, I tried not to miss any config and settings that my site did

@mattchannn Can you please provide me with a minimal reproduction?
Unfortunately, I don't have the bandwidth to figure out if it's because gatsby-remark-embedder or because another package is causing the troubles.

@MichaelDeBoey this is the repo.

There is just one page and one article. You can start the project by running gatsby develop.
Let me know if you have any questions.

@antogada you saved my day, I have the same issue like yours...

@antogada @mattchannn Please provide me with a bare minimum reproduction repo. So only the really necessary plugins provided. That way I'm sure I'll only put my time & effort in solving a problem that gatsby-remark-embedder is causing.

@MichaelDeBoey Hi, please check my repo again, removed all unnecessary plugins

kxxt commented

I encountered the same issue in my personal website using gatsby-plugin-mdx. However, in another repo, it works fine with gatsby-transformer-remark.

kxxt commented

I'm not sure if this bug is related to gatsby-plugin-mdx, but if you prefer MarkdownX syntax, you can try gatsby-plugin-mdx-embed which works fine for me.

www.mdx-embed.com/

@kxxt Seems like a breaking change to me..

Plus.. as the README said it supports 2 mdx plugin, I think it will be great to review if there's room for fixing this specific issue

Gatsby is not calling your default export (babel is not transforming default exports to module.exports = default). The PR #214, notably the addition of babel-plugin-add-module-exports fixes it. You could also just have a non-esm wrapper entrypoint that maps that for you without the transform if you are opposed to that dev dependency.

(tip to other readers: clear gatsby cache to see the change if you've been debugging and don't see any changes)

First of all: I'm sorry to have you guys kept waiting for so long.
Life caught up with different priorities, so didn't have time to dedicate on fixing this one.

@jsg2021 So this essentially comes down to the way we do the export?

And we should just change this line

export default async (

to

module.exports = async (

?

@MichaelDeBoey yes, that would accomplish the same end.

Should be fixed by #225 then

๐ŸŽ‰ This issue has been resolved in version 6.0.1 ๐ŸŽ‰

The release is available on:

Your semantic-release bot ๐Ÿ“ฆ๐Ÿš€