Treat .mdx as .md file for now

[jamiekyle-eb]

Description

MDX (.mdx) is an superset on top of CommonMark (Markdown) that supports JSX and JavaScript's imports/exports:

• MDX: https://mdxjs.com/
• CommonMark: https://commonmark.org/
• JSX: https://facebook.github.io/jsx/
• export: https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export
• import: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

I don't know what supporting the full syntax of MDX would look like for GitHub, but this will at least improve it somewhat

Syntax Example

import Layout from '../components/Layout';
import Button from '../components/Button';

export { Layout };

# Button

> A simple button component

<Button/>

<!-- Note: ^this <Button/> will be rendered -->

Checklist:

• I am associating a language with a new file extension.
  • The new extension is used in hundreds of repositories on GitHub.com
    • Search results for each extension:
      • https://github.com/search?q=extension%3A.mdx+js&type=Code
  • I have included a real-world usage sample for all extensions added in this PR:
  • I have included a change to the heuristics to distinguish my language from others using the same extension.

[jamiekyle-eb]

Note: Right now, many users are making their .mdx files use the .md file extension just so that it renders nicely on GitHub. Which is bad because the languages will become more entangled on GitHub.

This extension could be moved to another language definition later on, but for now it will cause people to use the correct file extension.

[Alhadis]

This PR is missing a sample .mdx file. Could you add one under samples/Markdown/? This one will do (decent-size example, MIT-licensed).

Other than that, everything looks great. 👍

[jamiekyle-eb]

@Alhadis Done!

[Alhadis]

LGTM! 👍

/cc @lildude

[pchaigno]

Looks like rendering of .mdx files with the Markdown renderer is not ideal, but might be okay. Not sure how it renders when you have a lot more JSX in there.

[Alhadis]

If users are deliberately using .md just to improve the appearance of MDX files on GitHub, I'd say the less-than-ideal rendering is a loss we can take...

[pchaigno]

@Alhadis Except they might be careful and only use .md for files that render properly, whereas we'll render everything regardless of the end result. But I agree, we should go for it, and we'll see if we need to improve that situation later.

[jamiekyle-eb]

I was planning on coming back to this when I have more time to improve the situation even more. There are syntax definitions for MDX files that Linguist could use, but how GitHub renders them is a whole other question.

I'd need to figure out how to get GitHub to render a separate format as Markdown and how to make the imports/exports/jsx render as code blocks.

[Alhadis]

I'd need to figure out how to get GitHub to render a separate format as Markdown and how to make the imports/exports/jsx render as code blocks.

Rendering is handled by github/markup, another Ruby gem which selects the library appropriate for rendering a document format.

Bear in mind: I don't believe the markup gem is accepting new formats, because each supported format needs to be maintained and sandboxed, and I recall reading somewhere that GitHub no longer have the manpower to achieve all this.

I'm afraid you're unlikely to have any luck, given how much of a trainwreck the NPM ecosystem is when it comes to dependencies and security.

[wooorm]

Referencing #6339, which adds a proper syntax highlighting grammar :)