Questions tagged [gatsby-plugin-mdx]
40 questions
6
votes
2 answers
Can't require remark and rehype plugins for gatsby-plugin-mdx
I was trying to follow the documentation on including rehype plugins for gatsby-plugin-mdx. Specifically I was trying to use the rehype-slug plugin. I installed the packaged with npm and set my gatsby.config.js file to
module.exports = {
…
bitesizebo
- 163
- 1
- 5
4
votes
1 answer
Passing common prop to all components in MDX file, without adding the prop to each component
I've got mdx files with components that need to be locale aware.
Lots of components.
And they all need to be locale-aware.
In the .mdx files, I can change them from this:
Félix Paradis
- 5,165
- 6
- 40
- 49
3
votes
0 answers
Images getting wrapped in extra div when using combination of gatsby-plugin-mdx and gatsby-remark-images
I'm using the following versions:
"gatsby": "^4.21.1",
"gatsby-plugin-mdx": "^4.0.0",
"gatsby-remark-images": "^6.21.0",
"remark-unwrap-images": "^3.0.1",
And I have the following in place as part of my gatsby-config.js:
{
resolve:…
MrPinguino
- 61
- 5
2
votes
1 answer
Issues migrating gatsby-starter-texblog to Gatsby v4 with gatsby-plugin-mdx
I'm currently trying to update my blog site, which is based on the gatsby-starter-texblog template, to work with the latest version of GatsbyJS. To do so, I've been following the instructions in the gatsby-plugin-mdx documentation, specifically the…
user2709619
- 51
- 4
2
votes
1 answer
gatsby-plugin-mdx unable to resolve images from frontmatter and body at the same time
The repo I am having trouble with is https://github.com/agenciaglobal/web
this is my gatsby-config.js. at least the concerning part.
{
resolve: `gatsby-source-filesystem`,
options: { path: `${__dirname}/content`, name: `content` },
…
CESCO
- 7,305
- 8
- 51
- 83
1
vote
0 answers
Image not displaying in .mdx file using gatsby-plugin-mdx & gatsby-remark-images
I have this .mdx file:
But the image is not displaying on my website, even if it seems to work. The element created is 0x0
My plugins for gatsby-config.js file:
plugins: [
{
resolve:…
Davide_Romano
- 11
- 1
1
vote
1 answer
Default layout in Gatsby MDX V4
I have recently updated Gatsby from V3 to V4(latest one) and also updated the plugins below.
"@mdx-js/mdx": "^2.1.3",
"@mdx-js/react": "^2.1.3",
"gatsby-plugin-mdx": "^4.1.0",
"gatsby": "^4.21.1",
The code in
node-config.js -
{
resolve:…
Prithviraj Mitra
- 11,002
- 13
- 58
- 99
1
vote
1 answer
How to embed images in frontmatter with gatsby-plugin-mdx v4?
A while back I followed this tutorial to implement image embeds in MDX posts. See this query on Stack Overflow for context as well.
A v3 example template using this:
/* Post.jsx @ gatsby-plugin-mdx v3 */
import React from "react"
import { graphql }…
Magnus Kolstad
- 407
- 1
- 6
- 17
1
vote
2 answers
Gatsby site not generating slugs as expected
I was following the Gatsby tutorial, but I'm not seeing what they are seeing when it comes to generating slugs for mdx files in a subdirectory of src/pages. For example when I have a file like src/pages/projects/devmarks/index.md, according to the…
Christopher Leggett
- 33
- 7
1
vote
1 answer
Using inline images with Gatsby plugin mdx
I am pulling in data from airtable that uses an external URL inside of its quite long markdown, something like this:
...
testing
...
However, when this is built and rendered, the image is…
ParthianShotgun
- 602
- 4
- 20
1
vote
2 answers
How to get only a portion of the mdx rendered article with gatsby? For example, first several sentences of a mdx blog article?
I am making a blog using GatsbyJS + MDX. For the articles list page, I want to show the first several sentences/paragraphs of each article (just as you almost always see in a normal blog). However, I cannot figure out a way to do so in mdx.
For…
ch271828n
- 15,854
- 5
- 53
- 88
1
vote
1 answer
gatsby-plugin-mdx cannot find module 'gatsby/webpack'
I've just added gatsby-plugin-mdx to my gatsby plugins, but I keep getting this error when I start the project.
Error in "/Gatsby/node_modules/gatsby-plugin-mdx/gatsby-node.js":
Cannot find module 'gatsby/webpack'
I did notice that there were some…
Biki Bico
- 35
- 6
1
vote
1 answer
Gatsby Dynamic Routing URL for Generating Layouts
So I generate conditional layouts with this code:
exports.onCreatePage = ({ page, actions }) => {
const { createPage } = actions;
if (page.path.match(/about/)) {
page.context.layout = "special";
createPage(page);
}
if…
Dom V
- 51
- 7
1
vote
1 answer
gatsby-plugin-mdx with rehype-autolink-headers only working with wrap option
I am trying to get my site setup with Gatsby + MDX. I am looking at the documentation here and want to make use of the autolink-header-option. I have tried using the rehype and remark plugins for this, but I can only get the Rehype plugin to work…
alex9552
- 231
- 1
- 5
1
vote
1 answer
Gatsby's mapping between markdown files
I'm creating a multi-author site (using gatsby-plugin-mdx) and have the following file structure:
/posts
- /post-1/index.mdx
- /post-2/index.mdx
- ...
/members
- /member-a/index.mdx
- /member-b/index.mdx
- ...
In the frontmatter of the post page I…
Art
- 453
- 4
- 12