mdx-js / mdx

Markdown for the component era
https://mdxjs.com
MIT License
17.71k stars 1.14k forks source link

Allow any `createElement` import / implementation in the loader. #714

Closed axdg closed 5 years ago

axdg commented 5 years ago

Subject of the feature

Allow the loader to work with createElement implementations other than reacts.

Problem

mdx-loader creates a hard dependency on react and @mdx-js/react by prepending their import to the compiled output (see here).

Alternatives

Would you be open to a PR that would allow the loader to take an prepended string (defaulting to the current one^^)? This would mean one could use any createElement implementation they wanted.

My particular usecase is the use of superfine, so I'll use that as an example - I could make that work if the loader prepended this string;

import { h } from 'superfine'
const mdx = (function (createElement) {
  return function (name, props, ...children) {
    if (typeof name === 'string') {
      if (name === 'wrapper') return children.map(createElement)
      if (name === 'inlineCode') return createElement('code', props, ...children)
    }

    return createElement(name, props, ...children)
  }
}(createElement))
// ...compiled MDX.

Essentially, this would just add a (backwards compatible) prepend option to the loader.

johno commented 5 years ago

I would accept a PR for this and would love a superfine example to go along with it!