Alternative Syntax

Here’s another potential idea @johno: What if MDX had everything inside {{}} be JS, kind of like a reverse of JSX? It’d be a similar concept to Mustache. Here’s an example:

# This is a {{<b>}}*header*{{</b>}}

This is a paragraph.

{{<Button>}}
  This is a *Markdown* button
{{</Button>}}

- This is
- a list

{{
  // This is just plain JS
  const size = 123;
  import MyCanvas from './MyCanvas';
}}

{{<MyCanvas width={size} height={size} />}}

Or here’s an idea using just one, which I originally thought would clash with plain text that uses {, but it could be escaped as \{

# This is a {<b>}*header*{</b>}

This is a paragraph.

{<Button>}
  This is a *Markdown* button
{</Button>}

- This is
- a list

{
  // This is just plain JS
  const size = 123;
  import MyCanvas from './MyCanvas';
}

{<MyCanvas width={size} height={size} />}

_Originally posted by @sdegutis in https://github.com/mdx-js/mdx/issues/628#issuecomment-519705483_

[sdegutis]

Thanks everyone for your responses. It seems that, at the moment at least, the requirements I have don’t fully line up with MDX’s roadmap. I think this issue can be considered closed.

[timneutkens]

Based on the comments I read you basically want:

• A different syntax
• A different parser
• Different compilation output
• Different semantics

Which sounds like you want to build a new library, rather than change MDX or even fork it. Which is totally fine, it just doesn’t fit into this project / it’s goals in my opinion.

For reference there was an existing MDX implementation that existed even before we wrote the MDX spec, it didn’t quite suit our needs at the time so we released mdx-js/mdx to solve our particular needs.