Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

mdast-util-mdx-jsx

Package Overview
Dependencies
Maintainers
2
Versions
24
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

mdast-util-mdx-jsx

mdast extension to parse and serialize MDX or MDX.js JSX

  • 3.1.3
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
3M
increased by4.18%
Maintainers
2
Weekly downloads
 
Created

What is mdast-util-mdx-jsx?

The mdast-util-mdx-jsx package is a utility for working with MDX (Markdown for the component era) JSX nodes within the mdast (Markdown Abstract Syntax Tree) format. It allows for parsing, manipulating, and serializing MDX JSX nodes in the context of mdast, making it a powerful tool for developers working with MDX content in JavaScript and TypeScript projects.

What are mdast-util-mdx-jsx's main functionalities?

Parsing MDX JSX nodes

This feature allows for the parsing of MDX JSX nodes from a Markdown string. The code sample demonstrates how to use the package in conjunction with `mdast-util-from-markdown` to parse a string containing an MDX JSX component into an mdast syntax tree.

"use strict";

var fromMarkdown = require('mdast-util-from-markdown');
var mdxJsx = require('mdast-util-mdx-jsx');

var doc = '<Button>Click me!</Button>';

var tree = fromMarkdown(doc, {
  extensions: [mdxJsx.fromMarkdown()],
});

console.log(tree);

Serializing MDX JSX nodes

This feature enables the serialization of MDX JSX nodes back into a Markdown string with embedded JSX. The code sample shows how to convert an mdast syntax tree containing an MDX JSX element back into a Markdown string using `mdast-util-to-markdown` with the mdx-jsx extension.

"use strict";

var toMarkdown = require('mdast-util-to-markdown');
var mdxJsx = require('mdast-util-mdx-jsx');

var tree = {
  type: 'root',
  children: [
    {
      type: 'mdxJsxFlowElement',
      name: 'Button',
      children: [{type: 'text', value: 'Click me!'}]
    }
  ]
};

var doc = toMarkdown(tree, {
  extensions: [mdxJsx.toMarkdown()],
});

console.log(doc);

Other packages similar to mdast-util-mdx-jsx

Keywords

FAQs

Package last updated on 27 Aug 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc