Stack Overflow
Stack Overflow

Questions tagged [mdxjs]

MDX is an authorable format that lets users write JSX in markdown documents.

153 questions
13
votes
1 answer

What's the Difference between Remark & Rehype?

I'm a bit confused. I think remark is a markdown processor, rehype is an html processor. So remark takes some markdown, transforms it, and gives me back some markdown. Rehype takes some html, transforms it, and gives me back some html - is this…
antonwilhelm
  • 5,768
  • 4
  • 19
  • 45
12
votes
2 answers

How to use @next/mdx with NextJS 13 app directory?

With the new app directory, all route directories must have a page.js, page.jsx or a page.tsx file to be visible publicly (eg: mywebsite.com/about requires a file app/about/page.js). But when I try with MDX file app/about/page.mdx, and use nextMDX…
Mirado Andria
  • 301
  • 3
  • 9
12
votes
2 answers

Markdown content in tabs using Docusaurus v2

I try to add markdown code inside a Tab, as explain the documentation. The name file name has .mdx extension. Here its content: import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem';
angelcervera
  • 3,699
  • 1
  • 40
  • 68
10
votes
2 answers

Vercel: ERROR Error: The package "esbuild-linux-64" could not be found, and is needed by esbuild

Hope you all are having a good time. I am working on a simple NextJs application where I want to have multiple subdomains in it. I am deploying the application on vercel. What my application does is it have a simple textarea where you write MDX, you…
zainsci
  • 209
  • 2
  • 8
8
votes
0 answers

Missing Types in Gatsby with GatsbyImageData and Mdx

I have a site using Gatsby (with gatsby-plugin-image) and I am trying to refactor to Typescript. This is my first experience with ts I have a layout page that uses a pagequery that pulls Mdx data, however I am missing some types though and wondered…
Nick Wild
  • 525
  • 1
  • 11
  • 22
8
votes
1 answer

How to have markdown content in components in MDX files?

I'm working on a project with MDX pages using React components. When I add text inside the component I would like to have HTML generated (like with content outside of components). But the generated page has only text inside the component and not…
JulSeb42
  • 393
  • 3
  • 12
8
votes
3 answers

How do I embed global React components in Docusaurus v2?

I see that it is possible to embed React components with MDX: https://v2.docusaurus.io/docs/markdown-features/#embedding-react-components-with-mdx However, this method works for a specific page. How can I make it work for all markdown files in the…
Onur Zobi
  • 81
  • 5
7
votes
1 answer

How to correctly use @mdx-js/loader with create-react-app?

Just following the instructions from: https://mdxjs.com/docs/getting-started/#create-react-app-cra I did the following: $ npx create-react-app react-app $ cd react-app $ npm install @mdx-js/loader Then as per the getting started guide, created the…
js251150
  • 71
  • 2
7
votes
3 answers

How to use images in a `.mdx` file outside of `public/` folder while using `next-mdx-remote` in Next JS?

I am making a blog with next-mdx-remote & want to use images in the .mdx file outside of the public/ folder. Here's the complete code of my blog project → https://github.com/deadcoder0904/blog-mdx-remote I have the following folder structure: . ├──…
deadcoder0904
  • 7,232
  • 12
  • 66
  • 163
5
votes
1 answer

MDX styling (next-mdx-remote) fails after I install Tailwind css in a Next.js app

I'm using next-mdx-remote to make use of MDX in my Next.js project. I've been following JetBrains WebStorm guide to build this, here they've used bootstrap as their CSS but my choice of CSS framework was tailwind css. The thing is when I install…
undefinedzack
  • 53
  • 4
5
votes
0 answers

Can you limit what React components an MDX page will render?

I'm wondering if there's a straight forward approach to creating allowed components and blocked components on an MDX JS page (Markdown with JSX included). I'd like to use MDX for user generated content and realize there are a lot of security issues…
webstackdev
  • 850
  • 15
  • 23
5
votes
2 answers

Gatsby doesn't render MD in component inside of mdx file

What is working: The layout is correctly applied to each of my pages The MDX file correctly gets the Hero and section component and renders the HTML/CSS of the container correctly The data from MDX is loaded and displayed What is NOT working: The…
Richard
  • 1,543
  • 3
  • 25
  • 49
4
votes
0 answers

Cannot use next/image with mdx-bundler

I have a blog that uses nextjs and mdx bundler, when I try to import the NextJS Image component inside an MDX file, I get this error: Error: Build failed with 2 errors: ../node_modules/next/dist/compiled/micromatch/index.js:22:3444: ERROR: Could not…
Youssef Bouzekri
  • 41
  • 5
4
votes
1 answer

How to import remark-gfm in next.config.js?

I want to use MDX in next.js and remark-gfm plugin. I found Next.js Docs about MDX and follow this. and add import statement. // next.config.js import remarkGfm from 'remark-gfm;' const withMDX = require('@next/mdx')({ extension: /\.mdx?$/, …
baba1
  • 49
  • 3
4
votes
1 answer

Autocomplete in .MDX files using VScode

When I import something from .js or .ts files in .mdx files I would like to see autocomplete suggestions from VScode. Also when I define variable inside .mdx file, I'm waiting that VScode will suggest me this variable's name. // for example const…
Андрій Грушецький
  • 69
  • 6
1
2 3
…
10 11