You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I've been following the recent docs on MDX to create a simple project. I've successfully generated pages programmatically. When I added gatsby-remark-imges using these instructions, adding an inline image (such as ![thing](./my-image.jpg)) results in:
Warning: Each child in a list should have a unique "key" prop.
Check the render method of `MDXContent`.
The blurred image then appears above the proper image.
This happens on both my programmatically created pages (which uses a layout with MDXRenderer) and my pages pages (which uses a simple layout passing in {children}.
Steps to reproduce
Follow MDX instructions in docs: Add gatsby-remark-images and gatsby-transformer-sharp to plugins, add basic config, try to add an inline image to the page.
Adding an inline image using markdown should result in successfully rendering an image.
Actual result
An error appears in the console about MDXContent needing each child in a list to have a "key" prop, and the blurred image appears on top of the plain image.
Description
I've been following the recent docs on MDX to create a simple project. I've successfully generated pages programmatically. When I added
gatsby-remark-imges
using these instructions, adding an inline image (such as![thing](./my-image.jpg)
) results in:The blurred image then appears above the proper image.
This happens on both my programmatically created pages (which uses a layout with
MDXRenderer
) and mypages
pages (which uses a simple layout passing in{children}
.Steps to reproduce
Follow MDX instructions in docs: Add
gatsby-remark-images
andgatsby-transformer-sharp
to plugins, add basic config, try to add an inline image to the page.Here's my plugin config:
Expected result
Adding an inline image using markdown should result in successfully rendering an image.
Actual result
An error appears in the console about MDXContent needing each child in a list to have a "key" prop, and the blurred image appears on top of the plain image.
Environment
System:
OS: macOS 10.14.6
CPU: (6) x64 Intel(R) Core(TM) i5-8500B CPU @ 3.00GHz
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 10.15.3 - ~/.nvm/versions/node/v10.15.3/bin/node
Yarn: 1.14.0 - ~/.nvm/versions/node/v10.15.3/bin/yarn
npm: 6.4.1 - ~/.nvm/versions/node/v10.15.3/bin/npm
Languages:
Python: 2.7.10 - /usr/bin/python
Browsers:
Chrome: 76.0.3809.100
Firefox: 67.0.4
Safari: 12.1.2
npmPackages:
gatsby: ^2.8.2 => 2.8.2
gatsby-plugin-mdx: ^1.0.23 => 1.0.23
gatsby-plugin-sharp: ^2.2.12 => 2.2.12
gatsby-plugin-styled-components: ^3.1.2 => 3.1.2
gatsby-remark-images: ^3.1.12 => 3.1.12
gatsby-source-filesystem: ^2.1.9 => 2.1.9
npmGlobalPackages:
gatsby-cli: 2.6.4
The text was updated successfully, but these errors were encountered: