Function compile

apps/site/mdx/compiler.mjs:30–75

(
  source,
  fileExtension,
  components = {},
  props = {}
)

 * }>}
 */
export default async function compile(
  source,
  fileExtension,
  components = {},
  props = {}
) {
  // Parses the Frontmatter to the VFile and removes from the original source
  // cleaning the frontmatter to the source that is going to be parsed by the MDX Compiler
  matter(source, { strip: true });

  // Creates a GitHub slugger to generate the same slugs as GitHub
  const slugger = createGitHubSlugger();

  // Compiles the MDX/Markdown source into a serializable VFile
  const compiled = await mdxCompile(source, {
    rehypePlugins,
    remarkPlugins,
    format: fileExtension,
  });

  const interpreter = createInterpreter({
    ...components,
    'react/jsx-runtime': reactRuntime,
  });

  // Run the compiled JavaScript code from MDX
  interpreter.run(compiled.toString());

  // Retrieve the default export from the compiled MDX
  const MDXContent = interpreter.exports.default;

  // Render the MDX content directly from the compiler
  const content = <MDXContent {...props} components={components} />;

  // Retrieve some parsed data from the VFile metadata
  // such as frontmatter and Markdown headings
  const { headings = [], matter: frontmatter, readingTime } = source.data;

  headings.forEach(heading => {
    // we re-sluggify the links to match the GitHub slugger
    // since some also do not come with sluggifed links
    heading.data = { ...heading.data, id: slugger(heading.value) };
  });

  return { content, headings, frontmatter, readingTime };
}