MDX is an authorable format that lets users write JSX in markdown documents.
Questions tagged [mdxjs]
153 questions
0
votes
0 answers
Import react component and add to dom automatically
I am trying to run my jsx within a javascript file like this:
import React from 'react'
export class HeaderNav extends React.Component {
constructor(props) {
super(props)
console.log('Created Component')
}
}
console.log('Create New…
Get Off My Lawn
- 34,175
- 38
- 176
- 338
0
votes
2 answers
Is ".mdx" file format only supported/used by React.js
Almost all the references online mention the use of MDX with React.js. Even though other frameworks or libraries support MDX (with help of components), I haven't specifically seen the use of ".mdx" file formats outside of React.
The support of…
Gangula
- 5,193
- 4
- 30
- 59
0
votes
1 answer
Using react-query inside next-mdx-remote MDX Components?
I'm using next-mdx-remote in my next.js application. One of the components I'm passing to it does a API call via axios. This works fine. I now want to move to react-query however. I get the following error:
No QueryClient set, use…
antonwilhelm
- 5,768
- 4
- 19
- 45
0
votes
1 answer
Convert code returned by bundleMDX into HTML string for RSS while using mdx-bundler
I want to convert code returned by bundleMDX to string for RSS reader I'm writing so I can use it with ReactDOMServer.renderToStaticMarkup(mdx)…
deadcoder0904
- 7,232
- 12
- 66
- 163
0
votes
1 answer
Styling MDX Files with Chakra UI
I am trying to style markdown files using Chakra UI in a next.js app. To that extent, I have created the following MDXComponents.tsx file:
import { chakra } from "@chakra-ui/react"
const MDXComponents = {
p: (props) =>
Moshe
- 6,011
- 16
- 60
- 112
0
votes
1 answer
Typescript's declare module with body and without
I've got a .mdx file.
Having the following in mdx.d.ts:
///
Sun
- 299
- 1
- 8
0
votes
1 answer
How to insert markdown into a React component with MDX
If I have some stuff in a markdown file foo.md, what is the best way to "inject" this into a component
SorghumBean
- 15
- 5
0
votes
1 answer
passing space preserved code to react component in docusaurus
I have a need to use a custom code editor in docusaurus. I am trying to put together a react component so that I can use the following syntax in the mdx document.
return 42;
I had problems making this work (which I will explain…
Siva
- 1,096
- 7
- 20
0
votes
1 answer
Setting MDX Component Props in NextJS
So I am working on a layout system in my next app based on Adam Wathan's method and his tailwlind website. I have it working for js files, but can't seen to get the syntax for doing it in mdx files.
The way it works is using an _app.js like…
Paul DeVito
- 1,542
- 3
- 15
- 38
0
votes
1 answer
Add RSS to Next.js MDX Blog while using `rss` module for Node JS . How do I convert MDX to HTML?
Currently, I am having an issue with converting MDX to HTML.
I'm doing it for Tailwind Blog
The complete code on Github → https://github.com/tailwindlabs/blog.tailwindcss.com
Here's the relevant code:
scripts/build-rss.js
import fs from 'fs'
import…
deadcoder0904
- 7,232
- 12
- 66
- 163
0
votes
1 answer
Create loader that maps URL path to a component using Webpack in Next JS
I want to create a loader in Next.js which uses Webpack underhood it's next.config.js config file that will load Blog.js for /blog route & Tutorial.js for /tutorial route.
The MDX data is in pages/ directory. pages/ contains blog/ & /tutorial which…
deadcoder0904
- 7,232
- 12
- 66
- 163
0
votes
1 answer
In storybook MDX file, how to I enter literal markup
I created a story using MDX. I want to demonstrate my inhouse-styles for buttons.
The story contains the following:
Primary Button
When rendered, story book shows
Kevin Gill
- 407
- 1
- 5
- 14
-1
votes
1 answer
How do I find the utilities package in the NextJS tailwindcss docs?
In the tailwindcss documentation site (https://github.com/tailwindlabs/tailwindcss.com/tree/master), they have have the following import:
import utilities from 'utilities?plugin=width'
as part of something like:
import utilities from…
Foobar
- 7,458
- 16
- 81
- 161
-1
votes
3 answers
Trying to build a Blog with NextJS & MDX. However I keep coming across this error. Does anyone knows what this error means
This is the error message that keeps on appearing when I click a link.
Scott Pessoa
- 9
- 2
-1
votes
1 answer
MDXRenderer - Auto adjust image to container
I have created a simple default page that gets rendered with content (images and text) from GraphCMS.
I can query and display the content, but I'm not sure how to make the images adjust to the view/container, as I don't know how to access the image…
Mathias Riis Sorensen
- 504
- 3
- 13
- 34